下にスクロールすると消えて、上にスクロールすると現れる固定ヘッダーを実装する方法をご紹介いたします。jQueryは使わずに素のJavaScriptで実装する方法です。 挙動については、以下デモページをご参照ください。 デ…
下にスクロールすると消えて、上にスクロールすると表示される固定ヘッダーをjQueryを使わずに実装する方法
Gutenbergの不要なブロックを削除し必要なブロックのみを表示させる方法
WordPressの新しい投稿エディタ「Gutenberg(ブロックエディタ)」では様々なブロックが用意されていますが、ブロックの数が多すぎて混乱してしまうこともあるみたいです。ブロックの数が多いのは便利である一方、Gu…
各セクションを重なるようにスクロールさせることができるjQueryプラグイン「StickyStack.js」
StickyStack.jsは、スクロールに合わせて下の要素が上に重なっていくようなエフェクトを加えることができるjQueryプラグインです。要素が下からせり上がってくるような印象を与えることができます。 挙動は以下ペー…
IEにもobject-fitを対応させるためのスクリプト「object-fit-images」
object-fit-imagesは、IEでもCSSのプロパティ「object-fit」を使えるようにするためのスクリプトです。 下記でデモをご確認いただけます。 デモページを見る object-fit-imagesの使…
jQueryを使ってアニメーションしながら指定した数字までカウントアップさせる方法
jQueryを使って、0から指定した数字までカウントアップする方法をご紹介いたします。指定した数字までアニメーションしながらカウントアップします。 以下にデモを用意しましたので、挙動についてはデモページをご参照ください。…
WordPressの投稿画面で親カテゴリーにチェックが入ったら子カテゴリーを表示する方法
WordPressの投稿画面で、子カテゴリーを予め非表示にしておき、親カテゴリーにチェックが入ったら表示するように挙動を変更する方法をご紹介いたします。 WordPressの投稿画面で親カテゴリーにチェックが入ったら子カ…
WordPressで子カテゴリーにチェックを入れたら親カテゴリーにも自動でチェックが入るようにする方法
WordPressのカテゴリーで親子関係がある場合、デフォルトでは子カテゴリーにチェックを入れても親カテゴリーに自動でチェックは入りません。 カテゴリーは親子セットで選択するケースが多いので、子カテゴリーにチェックを入れ…
画像比較に便利！スライドして画像を切り替えることができる軽量スクリプト「Beer Slider」
Beer Sliderは、2つの画像を比較するために、スライドして画像を切り替えることができるようになるスクリプトです。ビフォー/アフターの画像を比較したい時などに便利です。 以下のような感じで、画像の上にスライドが表示…
YouTubeの動画IDを指定するだけで動画のポップアップ再生を実装できるjQueryプラグイン「GRT Youtube Popup」
GRT Youtube Popupは、要素にYouTube動画のIDを指定するだけで、指定した動画をポップアップ再生できるjQueryプラグインです。使い方も簡単で、楽に実装できて便利です。 デモは配布サイトにてご確認い…
画像の遅延ロードを簡単に実装できる軽量スクリプト「Lazyestload.js」
Lazyestload.jsは、画像の遅延ロードを簡単に実装することができるスクリプトです。jQueryなどには依存せず、単体で動作します。 デモは以下よりご確認いただけます。 デモページを見る 画像が可視範囲に入って、…