サイト構築 -JavaScript

パララックスやさまざまなスクロールのエフェクトを簡単に実装できるJavaScriptライブラリ -Locomotive Scroll

Post on:2019年7月24日

Webページやスマホアプリで要素がビューポート内に入った時に、パララックスやさまざまなスクロールのエフェクトを実装できるJavaScriptライブラリを紹介します。 要素をスクロールに追従して表示させたり、視差効果を使っ

...記事の続きを読む

タッチデバイスも完全サポート!さまざまなスライダーをシンプルなコードで実装できる軽量JavaScript -Tiny slider

Post on:2019年7月17日

デスクトップ・タブレット・スマホをサポート、シンプルなスライダーをはじめ、さまざまなスライダーを簡単に実装できる軽量JavaScriptを紹介します。 バニラJSで実装されており、他のライブラリへの依存はなく、単体で動作

...記事の続きを読む

遅延読み込み、無限スクロールなど、要素と境界の交差を非同期で検出する1Kbの超軽量スクリプト -Bounds.js

Post on:2019年7月4日

画像の遅延読み込みや無限スクロールを実装する際、ページ上に境界を定義し、その境界に要素が入ったかどうか判定して実行します。要素と境界の交差を非同期に検出し、パフォーマンスを改善する1Kbの軽量スクリプトを紹介します。 要

...記事の続きを読む

この発想はすごい!アニメーションgifの再生・停止をコントロールできるJavaScriptライブラリ -Freezeframe.js

Post on:2019年6月26日

アニメーションgifの再生・停止をホバー・クリック・タップ、そしてボタン・アイコンでコントロールできる軽量JavaScriptライブラリを紹介します。 canvasに書き込むという発想がすごいですね。 通常アニメーション

...記事の続きを読む

たった4行のコードをコピペするだけで、Webサイトやブログをダークモードにする軽量JavaScript -Darkmode.js

Post on:2019年6月24日

既存ページにたった4行のコードをコピペするだけで、そのページをダークモードにするボタンを設置する5.73Kbの軽量JavaScriptを紹介します。 他のスクリプトへの依存はなく、カスタマイズも非常に簡単。ダークモードに

...記事の続きを読む

モーダルを開いている時にページがスクロールしてしまうのを防ぐCSSとJavaScriptのテクニック

Post on:2019年6月18日

ページ上でモーダルを開き、スクロールして、モーダルを閉じると、通常そのページはモーダルを開いた時とは別の場所にスクロールされた状態で表示されてしまいます。そして、スクロールした状態で、モーダルを開いて閉じると、一番上にス

...記事の続きを読む

SVGやCanvasで実装した平らな要素を3Dモデルでレンダリングできる超軽量JavaScriptライブラリ -Zdog

Post on:2019年6月7日

面白そうなJavaScriptがリリースされました! SVGやCanvasで実装した平らな要素をブラウザ上に3Dモデルでレンダリングすることができる超軽量JavaScriptライブラリを紹介します。レンダリングされた形状

...記事の続きを読む

2019年になってもまだjQueryを使用している理由

Post on:2019年6月5日

現在、jQueryを使用している人、そしてjQueryを取り去ろうとしている人がいると思います。jQueryの使用に対する一つの考え方を紹介します。 Why I'm still using jQuery in 2019

...記事の続きを読む

[JS]スクロール・マウスの位置や速度など、ビューポートの状態を簡単に取得できるJavaScriptライブラリ -Tornis

Post on:2019年5月22日

スクロールの速度に合わせたアニメーション、スクロールの位置に合わせたパララックス、マウスの位置・速度に合わせたパララックス、ビューポートのサイズに合わせたレイアウト変更などを実装するために、ビューポートを監視し、その状態

...記事の続きを読む

商品を360度回転できる画像ビューワーを簡単に実装できるスクリプト -JS Cloudimage 360 View

Post on:2019年4月25日

商品の画像を複数枚用意することで、商品を360度ぐるぐる回転できる画像ビューワーを簡単に実装できるスクリプトを紹介します。 操作はかなり快適で、単体で動作するスクリプトです。 JS Cloudimage 360 View

...記事の続きを読む

top of page

©2024 coliss