スクロールストップを通知するjQueryイベントの作り方
はじめまして、こんにちは。エンジニアのハルです。 Web開発で必要になったものを紹介していきます。 動きのあるWebページを作成していると、スクロールが止まった時に処理を動かしたいときがあります。しかし、残念なことに標準のイベントにはスクロール終了、停止時のイベントが用意されていません。 そこで今回は次のように簡単に実装できる、スクロールが停止した際のイベントの作り方を紹介します。 $(window).on("scrollstop",function(){ console.log("スクロールが停止しました。"); }); １．jQueryイベントオブジェクトを作成 スクロールストップ用のjQueryイベントオブジェクトを作成します。 イベント名は任意ですが、ここでは scrollstop とします。 var scrollStopEvent = new $.Event("scrollsto
60fps scrolling – 高速なスクロール表示をサポート
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました 動作の重たい処理をすれば、レンダリングが追いつかずに60fpsを維持できないのは当たり前です。しかし、だからこそ表示する内容やテクニックを駆使することで高速な描画を維持できるととてもインパクトがあります。 Webページのスクロールにおいても改善すべきポイントがあります。高速なスクロールを実現するためのハックが60fps scrollingになります。 60fps scrollingの使い方 現在はバージョン2になっており、多少やり方が変わっています。  解説動画はこちら。
[JS]スクロールを楽しくするパララックスを簡単に実装できる超軽量スクリプト -skrollr
jQueryなどの他のスクリプトに依存せず、スタンドアローンでパララックスのエフェクトを実装できる超軽量（2.2KB）のスクリプトを紹介します。 skrollr -GitHub [ad#ad-2] skrollrのデモ skrollrの使い方 skrollrのデモ パララックスは複数のエレメントを異なるスピードで動かすことで奥行きの錯覚を起こすもので、skrollrはスクロールの量に応じて、ページ上の各エレメントにさまざまなスタイルを定義することができます。 デモではその面白いパララックスのエフェクトが楽しめます。 デモは3つあり、まずはskrollrが楽しめるメインのデモから紹介します。
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
