jQueryで条件を指定する際に、特定のクラスが存在しているかどうかを判別する方法をご紹介いたします。 jQueryで特定のクラスが付いている場合のみ処理を実行する方法 例えば、div要素をクリックした時に、.hogeと…
jQueryで特定のクラスが付いている場合のみ処理を実行する方法

jQueryで条件を指定する際に、特定のクラスが存在しているかどうかを判別する方法をご紹介いたします。 jQueryで特定のクラスが付いている場合のみ処理を実行する方法 例えば、div要素をクリックした時に、.hogeと…
AOSは、スクロールと連動して、要素が可視範囲に入ったらアニメーションしながら表示させることができるJavaScriptライブラリです。様々なアニメーションが用意されているので、色んなサイトで活用することができます。 動…
fullPage.jsは、フルスクリーンでコンテンツを表示し、画面ごとにスクロールさせることができるjQueryプラグインです。 どういったページが実装できるのかについては、デモを見てもらうのが一番わかりやすいと思います…
fakeLoader.jsは、サイトにローディングアニメーションを実装することができるjQueryプラグインです。非常に簡単にローディングアニメーションを設置することができます。 挙動については、以下デモページにてご確認…
short-and-sweetは、textareaやinputでmaxlengthが指定されている場合に、入力可能な残りの文字数を表示してくれるスクリプトです。jQueryなどにも依存せず、単体で動きます。 以下に簡単な…
t.jsは、まるでタイピングされているようなアニメーションを文字に加えることができるjQueryプラグインです。 挙動については、以下デモページをご参照ください。 デモ1 デモ2 t.jsの導入手順 ステップ1. t.j…
Zoom SlideShowは、虫眼鏡によるズーム機能が備えられたスライダーを実装することができるjQueryプラグインです。 メインのスライド画像にマウスカーソルを合わせると、虫眼鏡が出てきて画像をズームできます。 Z…
ScrollHintは、スマホやタブレットの場合に、横にはみ出したテーブルを横スクロール可能にし、横スクロールができることを視覚的にわかるように教えてくれるスクリプトです。 デモは以下ページで確認できますので、スマホやタ…
CSSアニメーションとjQueryを組み合わせて、スクロール時のアニメーション効果を自前で実装する方法をご紹介いたします。 簡単なデモページも用意しましたので、挙動についてはデモをご参照ください。下にスクロールしていくと…
fitieは、IEでもobject-fitを使えるようにするためのスクリプトです。いわゆるポリフィル(Polyfill)というやつですね。 object-fitは、画像や動画を簡単にトリミングすることができる便利なCSS…