WEBGSAPのScrollTriggerを使ったスクロールアニメーションの動作を一度きりにするプロパティ
最近積みそうになったのでメモ書き。上記について調べると大体は下記のプロパティに対する解説が主な印象があります。 toggleActions 値形式：文字列デフォルト値：play none none none左から順番にonEn...
WEB WEBNext.js（TailwindCSS入り）プロジェクトを最速で立ち上げる手法
サクッと用意出来てコーディングに集中出来るように現時点での最速構築方法をまとめています。各バージョンによってはインストール方法が変わる可能性がありますので要注意してください。 環境バージョンmacOSv12.3.1Node....
WEBWordPressのテーマ内でショートコードを呼び出す方法
WordPressプラグインでショートコードを投稿や固定ページ本文に貼り付けるのが基本のようだが、開発としては自身のテーマ内に書くのが殆ど。作業するときにいつも忘れるのでメモ。
WEBJavaScriptをCSSのメディアクエリのような感覚で処理を分ける
CSSのメディアクエリのようにJavaScriptの処理を分けたいという要件は割とよく出てきます。そんなときによく使うコードは以下。 window.matchMedia
WEBWooCommerce利用サイトでユーザーページにログイン・パスワード変更後にログインできなくなった場合の対処方法
WooCommerceではユーザー登録機能を追加するわけでは無くWordPress本来の機能を使いますので、原因はSiteGuardなどセキュリティ向上用途でログイン方法に変更が加わっている場合であることが多いです。 要はSiteG...
WEBウィンドウの高さを取得後に要素へ代入する
よく使うメモ。 スマートフォン用に高さ 100vh とか使いたいところですが、CSSによっては適切に高さが設定されずに 0 となってしまうのでJavascriptで対応してしまうと考える手間が省けるのでお薦め。
WEBウィンドウサイズで画像の表示をJavascriptで切り替える
最近よく利用するのでメモがてら。 以下コード入れて、imgにクラス .js-resp 付与すると画面サイズで切り替えます。 画像にはファイル名の後ろに _pc と _sp と命名すればOK、HTMLに記述する場合には _pc の...
WEBフルスクリーン表示からスクロール後にナビなど表示させたい場合のTip
ファーストビューがフルスクリーン表示されていて、スクロール後に固定ナビなどを表示したい際などを想定。 スクリプトは主にスマートフォンサイトを想定していますが、PC表示でも問題は無いはず。
用途に応じて適宜調整すれば良いと思います。
...
WEBSlick.js スマートフォン表示時だけ適応させたい。
丁度使う機会があったのでメモ。
WEBAdvanced Custom Fieldsで設定したカスタムフィールド値を取得し、文字数制限して表示する
よく使う物なのでメモがてら。 下記は30文字以内であればそのまま出力、30文字超えている場合に29文字にカットし、文末にを追加します。