bl6.jpホームニュースレビューお出かけアプリウェブサイトMacカメラレタッチTips雑記bl6.jpファッション、写真、旅行、ガジェットなどの備忘録menuホームJavaScript画像の遅延読み込みを実装できる軽量のJavaScriptプラグイン「justlazy.js」JavaScript2017.10.31画像の遅延読み込みを実装できる軽量のJavaScriptプラグイン「justlazy.js」justlazy.jsは画像の遅延読み込みを実装することができるJavaScriptプラグインです。ファイル容量も軽量で、jQueryに依存することなく使用可能なところがうれしいですね。Webページの読み込み速度を少しでも短縮させたい人にはとても便利な機能といえます。justlazy.jsjustlazy.jsの実際のデモや具体的な実装方法は以下のページから確認できます。デモデモでは画像以外のコンテンツが先に読み込まれた状態になっていて、画像が表示される場所にはローディングアイコンが表示されています。画像が読み込まれるとローディングアイコンがある位置に画像が表示されます。先にテキストなどのコンテンツが読み込まれるので、重い画像を読み込んでいる間でもユーザーを無駄に長い時間待たせなくて済むのがいいですね。画像が読み込まれるまでテキストなどを読み進めることができるので、とても効率的です。使い方も簡単で、画像を設置するHTMLの要素には属性を指定することができます。属性には、data-src、data-alt、data-title、data-srcsetが用意されています。オプションにはonloadCallback、onerrorCallback、onreplaceCallback、thresholdといった項目のセッティングが可能です。いうわけで、画像の遅延読み込み機能を実装できる軽量のJSプラグイン「justlazy.js」の紹介でした。justlazy.jsの詳細やダウンロードは、以下のページからどうぞ。Shareは、縦型のソー...JavaScript超軽量で使い方もカンタンな日付ピッカー「flatpickr」flatpickrはjQueryなどのライブラリに依存することなく動作...JavaScriptサイズが異なる画像でもキレイに表示できるギャラリー実装「xGallerify」xGallerifyはギャラリーを作成するのに最適なjQueryプラグ...JavaScriptSVGによるドーナッツ状(円形)のチャートを実装できる「donutty」donuttyはSVGによるドーナッツ状(円形)のチャートを実装できる...検索:プロフィールbl6.jp心がときめく「モノ」や「コト」を中心に紹介しています。レビューや日記なんかも。TwitterFacebookInstagram最近の記事2020.02.20いつもの音楽をハイレゾ級で。ソニーの完全ワイヤレス...ソニーからハイレゾ級高音質と優れた接続性を備えた小型・軽量の完全ワイヤレスイヤホ...2020.02.19三色ボールペンの青と緑を「黒」に変えるいつも仕事で使っているジェットストリームの三色ボールペン(+シャーペン付き)。こ...2020.02.18成城石井オリジナルコーヒー豆「ブラジルイパネマ」アマゾンで買い物中に見つけた成城石井オリジナルコーヒー豆「ブラジルイパネマ」。...2020.02.17梅しば1年のどこかで無性にカリカリ梅を食べたくなる時期がある。