メニューの子カテゴリをjqueryでフワッと表示する
前回親カテゴリから子カテゴリを出力しましたが、今回はそのソースからマウスホバーで子カテゴリを表示する処理です。 CSSでも同じ様な動きができますが、今回はjqueryでシンプルにやってみます。
前回親カテゴリから子カテゴリを出力しましたが、今回はそのソースからマウスホバーで子カテゴリを表示する処理です。 CSSでも同じ様な動きができますが、今回はjqueryでシンプルにやってみます。
以前にwp_get_nav_menu_itemsを使用したメニュー作成を行いましたが、それの拡張でメニューに配置したカテゴリの子カテゴリをサブメニュー表示する方法です。 ここではwp_get_nav_menu_itemsに格納されている配列とget_term_children関数がポイントになります。
目次1 CSSの疑似要素の基礎を確認する1.1 ボーダーの特性1.1.1 borderのプロパティがどこに作用するか1.1.2 boderで三角を描く2 疑似要素の配置2.1 疑似要素配置の決まり事2.1.1 CSS3 ...
記事を見て興味を持った方が同じカテゴリの記事を参照する際のユーザビリティの向上と導線強化のため、スクロールに追従するトップメニューを導入しました。 当サイトのメニュー作成にあたってヘッダー部に固定されたメニューと、任意のスクロールポイントで出現するメニューの2つを用意。 よく見かけるのは下にスクロールすると消えるものですが、あまり頻繁に動きすぎると閲覧していて気が散ると思ったので任意のスクロールポイントだけの制御にしてあります。
前回の記事でコンテンツのフェードインを導入しましたが、データ量が多いためこのままでは読み込み中その部分が真っ白になってしまいます。 これじゃコンテンツがないのか読み込めていないのか分からないので、併せてローディングアニメーションも導入しました。
当サイトのフロントページは画像がやや大きめなのもあってか、少し読み込みが遅いのが気になっていました。 そこで最近はそれほど見かけない手法ですが、読み込みの遅い部分にエフェクトをかけてやればユーザーのストレスが多少和らぐかな?と思いローディングと併せて導入してみました。
目次1 サイトのスマホ対応いろいろ2 Multi Device Switcherプラグイン2.1 プラグインインストール2.2 子テーマを用意する2.2.1 必要なテンプレート2.2.2 子テーマ用style.cssに宣...
投稿の並びを単純にfloatのカラム落ちを利用していたのですが、これだと見出しの行数の増減で縦幅が変わった際に下段が右に寄ってしまうのです。 このズレを回避する方法は思いついただけで3通りあります。
DreamWeaverに慣れているとつい指が伸びてしまうショートカットをSublimetext3で実現するTIPS
もはや定番のエディタSubLimeText3の導入からweb作成が快適になるプラグイン導入・設定まで、備忘録ついでにメモしてみます。 SubLimeText3はデフォルトではシンプルなテキストエディタですが、プラグインの導入と設定で予測変換や入力補助、ワンボタンのブラウザプレビューまでできるDreamweaverと遜色のない環境を実現でき、しかも軽快なweb作成環境を実現できますので、まだという方は是非実践してみてください!