slickで実装されたスライダーで、ボタンをクリックしたらスライダーを一時停止できるようにする方法をご紹介いたします。一時停止処理はかなり簡単に実装できちゃいます。 slickでスライダーの一時停止処理を実装する方法 ま…
jQueryのスライダープラグイン「slick」でスライダーの一時停止処理を実装する方法
フォームで入力可能な残りの文字数をカウントして表示できるjQueryプラグイン「maxlength plugin」
maxlength pluginは、フォームのinputやtextareaのmaxlengthを読み取って、残りの入力可能な文字数を表示できるjQueryのプラグインです。 文字数のカウントはリアルタイムで更新されていき…
Cookieの同意を促すポップアップを簡単に実装できるjQueryプラグイン「jQuery Cookie Consent Plugin」
jQuery Cookie Consent Pluginは、Cookie使用への同意ボタンをポップアップ表示できるjQueryプラグインです。 jQueryに依存しますが、簡単にポップアップを表示することが可能です。 j…
WordPressの投稿一覧を無限スクロール化できるJavaScriptプラグイン「Infinite Scroll」
Infinite Scrollは次のページのコンテンツを読み込んで、無限スクロールを実現するJavaScriptプラグインです。デモページも用意されています。 Infinite Scrollを使って、WordPressの…
右クリック・ドラッグ&ドロップ・スマホでの長押しを無効化して画像保存を禁止する方法
PCだと右クリックやドラッグ&ドロップ、スマホでは長押しによる画像の保存を禁止する方法をご紹介いたします。 稀に、対策として実装してほしいと頼まれることがあるので備忘録として残しておきます。 CSSによる画像保存…
JavaScriptの実行を遅らせてページの表示速度を向上させるWordPressプラグイン「Flying Scripts」
Flying Scriptsは、JavaScriptの実行タイミングを遅らせることでページの表示速度を向上させるWordPressプラグインです。 JavaScriptの実行タイミングに関する属性ではasyncとdefe…
直前に開いていたページに戻るリンクを実装する方法
直前に開いていたページに戻るためのリンクを実装する方法をご紹介いたします。 ブラウザの戻るボタンを使えば良い話ではありますが、フォームの確認画面などで使うケースが結構あったりするので、覚えておいて損はないかなと思います。…
サイトに独自のCSSやJavaScriptを追加できるWordPressプラグイン「Simple Custom CSS and JS」
Simple Custom CSS and JSは、サイトに独自のCSSやJavaScriptを管理画面上から追加できるWordPressプラグインです。 管理画面上からコードを追加できるので、子テーマ化してテーマを編集…
jQueryを使って要素の高さをブラウザの高さにぴったり合わせる方法
jQueryを使って、要素の高さをブラウザの高さに合わせる方法をご紹介いたします。 例えば、メインビジュアルを画面いっぱいに表示したい時などに活用できます。CSSの指定だけでは思ったような表示にならない場合に参考にしてい…
JavaScriptで変数内に特定の文字列が含まれるかどうかを調べる方法
変数に入れた値の中に特定の文字列を含むかどうかで条件分岐させる方法をご紹介いたします。 JavaScriptを実装していると、結構使えるケースが出てくるので、覚えておくと役立つかと思います。 JavaScriptで変数内…