タグ "JavaScript" を含む投稿を表示中:62件
-
-
【jQuery】モーダルウィンドウ実装する超秀逸[Modaal]プラグインの使い方 このjQueryプラグイン、モーダルウィンドウを手軽に実装したい方に超絶オススメです! まずは実際の挙動を確認してみましょう。 DEMO : http://humaan.com/modaal/ 「VIEW EXAMPLE」をクリックすると、... 【jQuery】モーダルウィンドウ実装する超秀逸[Modaal]プラグインの使い方続きを読む →
-
-
-
-
-
【JavaScript】超軽量スムーススクロール『MoveTo』をご紹介! 今日紹介するJavaScriptライブラリ[MoveTo]は、容量が約1KBと軽量で、しかもjQueryに依存せずにスムーススクロールを導入できるスグレモノです。 サンプル:https://on-ze.com/demo/js-moveto/... 【JavaScript】超軽量スムーススクロール『MoveTo』をご紹介!続きを読む →
-
【JavaScript】単体で使える超軽量スライダー[Siema]は初心者の方にオススメです。 初心者のウェブ制作者の方でも簡単に扱えるカルーセルスライダー[Siema]を紹介します。 まずは実装してみたサンプルをどうぞ。 Siema 実装サンプル:https://on-ze.com/demo/js-siema/ 動作も軽快でサクッと... 【JavaScript】単体で使える超軽量スライダー[Siema]は初心者の方にオススメです。続きを読む →
-
【JavaScript】ページをスクロールすると要素が動きながら表示される[SCROLL TRIGGER]の使い方 ページのスクロールに連動して様々なエフェクトで要素が表示されていくJavaScriptプラグイン[SCROLL TRIGGER]を紹介します。 実際に導入したサンプルは以下より。 SCROLL TRIGGER DEMO : https://... 【JavaScript】ページをスクロールすると要素が動きながら表示される[SCROLL TRIGGER]の使い方続きを読む →
-
-
【jQuery】背景色を複数のグラデーションで彩るプラグイン「Shards」の実装方法。 複数のパターンのグラデーションがレイヤー状に重なる背景を描画できる jQuery スクリプト「Shards」の使い方です。 まずはGitHubで公開されているプラグイン本体をダウンロードしてきましょう。 https://github.com... 【jQuery】背景色を複数のグラデーションで彩るプラグイン「Shards」の実装方法。続きを読む →
-
【JavaScript】スクロールに連動して要素を自由自在に表示させる[AOS]の使い方 ウィンドウをスクロールさせると要素がフェードインしながら表示されるスクリプト[AOS(Animate On Scroll Library)]の使い方を紹介します。 まずは試しに実装してみたサンプルをご覧ください。 DEMO : https:... 【JavaScript】スクロールに連動して要素を自由自在に表示させる[AOS]の使い方続きを読む →
-
【JavaScript】超軽量Lightbox風スクリプト[Luminous]の使い方 つい最近見つけたLightbox風スクリプト[Luminous]がイイ感じです。 百聞は一見に如かず。 まずはサンプルをご覧ください。 サンプル : https://on-ze.com/demo/js-luminous/ お試しいただいたと... 【JavaScript】超軽量Lightbox風スクリプト[Luminous]の使い方続きを読む →
-
【JavaScript】画像の遅延読み込みを行うライブラリ[Layzr.js]の使い方 画像の遅延読み込みを行うJavaScriptライブラリ[Layzr.js]を紹介します。 ウェブページの読み込み時間短縮のために、ウィンドウの表示領域に入っていない要素や画像を非表示にしておいて、画面スクロールでウィンドウ内に入ってきたタイ... 【JavaScript】画像の遅延読み込みを行うライブラリ[Layzr.js]の使い方続きを読む →
-
【JavaScript】スワイプ操作にも対応したスライド式メニュー[Snap.js]の使い方 今回は[Snap.js]を使って左右にスライドするタイプのメニューを作成する方法を紹介します。 まずはサンプルをご覧ください。 Snap.js : オンズのサンプル これ、正式名称が不明確なんですが、巷では「スワイプ・メニュー」や「ドロワー... 【JavaScript】スワイプ操作にも対応したスライド式メニュー[Snap.js]の使い方続きを読む →
-