bl6.jpホームニュースレビューお出かけアプリウェブサイトMacカメラレタッチTips雑記bl6.jpファッション、写真、旅行、ガジェットなどの備忘録menuホームJavaScript優雅な慣性スクロールとパララックスエフェクトを実装できる「luxy.js」JavaScript2018.06.5優雅な慣性スクロールとパララックスエフェクトを実装できる「luxy.js」luxy.jsは優雅で美しい慣性スクロールとパララックスエフェクトを実装できるプラグインです。Vanilla.jsが使用されています。エレガントな雰囲気を感じさせる慣性スクロールとダイナミックな視差効果の組み合わせがとても素敵ですね。luxy.js以下、luxy.jsの実際のデモページになります。デモデモでは画面をスクロールすると慣性スクロールとパララックスエフェクトの両方を確認できます。スクロールして指を離した後でも急にとまることなく慣性が働くので、とても優雅な印象になります。画面の横幅いっぱいに広がった美しい背景画像に生じるパララックスエフェクトがダイナミックで見る人を魅了しますね。ラグジュアリーで高級感あふれるサイトなどには、ピッタリなプラグインになるのではないでしょうか?使い方・マークアップもシンプルに記述できるので、その点に関してもうれしい仕様です。HTMLタグにはdata属性も加えることができ、値を調節することでカスタマイズもできます。主なdata属性は、data-speed-x、data-speed-y、data-offset、data-horizontalです。オプションにはwrapper、targets、wrapperSpeedといった項目が用意されています。各オプションのデフォルト値は、wrapperが’#luxy’、targetsが’.luxy-el’、wrapperSpeedが0.08です。いうわけで、優雅で滑らかな慣性スクロールとパララックスエフェクトを実装できる「luxy.js」の紹介でした。luxy.jsの詳しい実装方法やダウンロードは、以下のページからどうぞ。Timespaceは上下左右と四方にドラッグ移動できる水...JavaScriptヘッダーとフッターを固定したままスクロール可能なテーブル「jTableScroll」jTableScrollはヘッダーとフッターを固定したままスクロール...検索:プロフィールbl6.jp心がときめく「モノ」や「コト」を中心に紹介しています。レビューや日記なんかも。TwitterFacebookInstagram最近の記事2020.02.20いつもの音楽をハイレゾ級で。ソニーの完全ワイヤレス...ソニーからハイレゾ級高音質と優れた接続性を備えた小型・軽量の完全ワイヤレスイヤホ...2020.02.19三色ボールペンの青と緑を「黒」に変えるいつも仕事で使っているジェットストリームの三色ボールペン(+シャーペン付き)。こ...2020.02.18成城石井オリジナルコーヒー豆「ブラジルイパネマ」アマゾンで買い物中に見つけた成城石井オリジナルコーヒー豆「ブラジルイパネマ」。...2020.02.17梅しば1年のどこかで無性にカリカリ梅を食べたくなる時期がある。