ページを水平にパララックスしつつスクロールさせられるjQueryプラグイン「jInvertScroll」:phpspot開発日誌
ページを水平にパララックスしつつスクロールさせられるjQueryプラグイン「jInvertScroll」 2013年09月19日- jInvertScroll - A lightweight jQuery horizontal Parallax scrolling plugin ページを水平にパララックスしつつスクロールさせられるjQueryプラグイン「jInvertScroll」 パララックスというと最近よく見ますが、殆どはたて型のスクロールですよね。 横にスクロールすることでまた違った印象を与えることができそうです。jQueryプラグインなので超簡単に実装が可能です 横スクロール型にすることで２DアクションゲームのようなWEBサイトにしてみても面白いかも。 関連エントリ レスポンシブなパララックス効果付きサイトを作るフレームワーク「CoolKitten」 パララックスなスライダーを実装
[JS]スクロールするのが楽しくなる！多彩なパララックスのエフェクトを簡単に実装できるオープンソースのスクリプト -Jarallax
Loodsmedia ディスプレイ内のコンテンツもパララックスします。 Jarallaxの使い方 「Demo 3」を例に、実装方法を簡単に紹介します。 外部ファイル 「jquery.js」と当スクリプトをhead内に外部スクリプトとして記述します。 <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript" src="jarallax-0.2.3b.js"></script> HTML HTML自体は通常通りに実装し、アニメーションのエフェクトを適用するエレメントには参照できるようid, classなどを付けます。 <h1 class="logo">Jarallax</h1> <div class="container" id="slide1"> <h2>見出し：slide
[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などのデザイン
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
