2020-10

タブメニュー

【タブメニュー】WordPress標準搭載のWP REST APIから投稿記事データをJSON形式で取得

WordPressに標準搭載されているWP REST APIから投稿記事データをJSON形式で取得し、カテゴリーごとに最新5件のコンテンツをフェードインで表示します。

アコーディオンメニュー

【アコーディオンメニュー】最初のアコーディオンメニューのみ開いた状態でページを表示

最初のアコーディオンメニューのみ開いた状態でページを表示します。アコーディオンメニューの開くボタン・閉じるボタンはCSSのみで作成しています。

マップ

【マップ】Googleマップを遅延表示してページの表示速度を改善

Googleマップを遅延表示してページの表示速度を改善します。GoogleマップはGoogle Maps APIを利用せず、通常のiframeタグを埋め込んで表示します。

レスポンシブ

【レスポンシブ】JavaScriptのwindow.matchMediaメソッドを利用した画像切り替え

JavaScriptのwindow.matchMediaメソッドを利用してPC用の画像とスマホ用の画像を切り替えます。画面リサイズ時はブレークポイントでのみ処理が発生し、windowのresizeイベントを監視する必要がありません。

タイトルとURLをコピーしました