[JS]奥行きを生み出す『パララックス』を簡単に実装できるスクリプト -Smart3D
複数の画像のスクロールのタイミングをずらして表示するパララックスを簡単に実装できるjQueryのプラグインを紹介します。 jQuery.Smart3D デモページ [ad#ad-2] パララックスはそれぞれのタイミングをずらして視差効果を生み出し、奥行き感を出すものです。 上記デモでは背景と人物の画像2枚をそれぞれマウスに合わせてずらして表示しています。 使用画像 5枚の画像を使用したパララックス Smart3Dの実装 一番最初に紹介したデモの実装方法です。 HTML 各画像をリスト要素で配置します。 <ul id="mindscape"> <li><img src=".../mindscape1.png" /></li> <li><img src=".../mindscape2.png" /></li> </ul> CSS スタイルシートでサイズを設定し、好みでborderなどのデザイン
[JS]HTMLのコンテンツを3Dに回転させるスクリプト -rotate3Di
rotate3Di - Flip HTML content in 3D デモ [ad#ad-2] rotate3Diの対応ブラウザ Firefox 3.5+ Chrome Safari IE 9(pre7+) 多分、Operaも大丈夫とのことです。 ※Opera 10で動作しました。 rotate3Diの実装 rotate3DiはjQueryのプラグインのため、実装にはjquery.jsが必要です。 外部ファイル JSファイルを外部ファイルとして記述します。 <script type="text/javascript" src="jquery-1.4.4.min.js"></script> <script type="text/javascript" src="rotate3Di/jquery-css-transform/jquery-css-transform.js"></script>
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
