2019年06月6日(木)
マウスの動きやスクロールなど、閲覧ユーザーのブラウザのビューポート状態を監視するスクリプト・「Tornis」
Tornis
Tornisはマウスの動きやスクロールなど、閲覧ユーザーのブラウザのビューポート状態を監視するスクリプトです。シンプルで軽量、依存関係もなく、使いやすい設計となっています。パララックスの為のスクリプトというわけではなく、ユーザーがどこまでスクロールしたか、マウスの速度や位置、スクロール速度などを監視する事が目的となります。
パララックス効果は作れるけど、基本的にはビューポートの監視を目的としているそうです。
使い方
ソース最後にスクリプトを読み込みます
監視内容を設定します
const trackMouse = ({ mouse, size, scroll }) => { if (mouse.changed) {//マウスの動きを監視 //マウス位置を取得 ...
author:
かちびと.net
WordPressやJQueryなどを中心に、Web開発者のためのチュートリアルやコードスニペットの記事を公開しているTakahashi Yoheiさんのブログ
‹ PREV
2019年最新版!最近見かけるロゴのデザインに使われているトレンドのまとめ -2019 Logo Trends
NEXT ›
イマドキ男子のメディア接触行動が明らかに【インテージの調査】
関連記事
Ads
WordPressやJQueryなどを中心に、Web開発者のためのチュートリアルやコードスニペットの記事を公開しているTakahashi Yoheiさんのブログかちびと.netの記事『マウスの動きやスクロールなど、閲覧ユーザーのブラウザのビューポート状態を監視するスクリプト・「Tornis」』についてまとめています。
この記事は特にjavascriptについて書かれており、 気になるWebデザインの記事やまとめを見つけたら「本文を読む」をクリックすると、記事配信元のかちびと.netで全文を閲覧することができます。RSS Sourceの「このサイトの記事一覧」をクリックするとかちびと.netの記事をまとめて表示することができます。また閲覧数や各SNSのシェア状況を目安に、他の人たちが記事をどのように評価しているのか推測することができます。Webデザインにとって有益な記事をまとめていますので、ぜひリンク先をチェックしてみてください。