ウェブハンバーガーメニューでメニュー外をクリックした際も閉じるを実行するナビゲーションの作り方【JavaScript】
プル デザイン プルデザイン | WEBやグラフィックデザイン情報サイト
端末の幅が狭い場合にハンバーガーメニューを表示しますが、PC版のサイトでもナビゲーションメニューが入りきらなかった時にも使用します。 …
ウェブ【ズーム機能を追加】Slick/全画面でふわっと切り替えスライドショー
プル デザイン プルデザイン | WEBやグラフィックデザイン情報サイト
基本の「slickの実装方法」については下記の記事で確認できます。 https://design-pull.com/web-desi …
ウェブモーダルウィンドウを簡単実装する。jQueryプラグイン【Lightbox2の使い方】
プル デザイン プルデザイン | WEBやグラフィックデザイン情報サイト
画像をクリックしたらモーダルウィンドウとして表示されるコードの書き方について解説。簡単にモーダルウィンドウを表示できるようにjQueryの …
ウェブコピペで簡単実装できる！粒子アニメーション生成方法【HTML・CSS・JS】
プル デザイン プルデザイン | WEBやグラフィックデザイン情報サイト
WEBサイトのトップページで使える粒子アニメーションの作り方について解説します。ほぼコピペで実装可能で用意するのは画像.pngのみなのでコ …
ワードプレスWordPressの投稿や記事ページごとに個別のCSSとJSを追加する方法【カスタマイズ】
プル デザイン プルデザイン | WEBやグラフィックデザイン情報サイト
基本的にトップページや投稿ページは同じCSSとJSを読み込んでいます。なので1つのページ投稿のみに適応したCSSを追加した場合でも、他のペ …
ウェブCodepenをもっと便利に使うための設定【無料機能】
プル デザイン プルデザイン | WEBやグラフィックデザイン情報サイト
CodePenで設定しておきたい便利な機能設定についてまとめておきます。無料版での設定ですので、コードの練習に最適ですね。 設定を変 …
ワードプレス子テーマでJSを読み込む方法【WordPress】
プル デザイン プルデザイン | WEBやグラフィックデザイン情報サイト
WordPressのテーマを使っている場合、親テーマに独自のJSを追加して動かす事が出来ますが、親テーマのアップデートがあると編集内容が上 …
ウェブCodepenの始め方と使い方-記事内にコード埋め込み【無料便利機能】
プル デザイン プルデザイン | WEBやグラフィックデザイン情報サイト
「自分で書いたコードを共有したい」「記事内にコードを埋め込みたい」「コードのプレビューを表示したい」この悩みを解決してくれる便利な機能が揃 …
ウェブSlick/全画面でふわっと切り替えスライドショー【jQuery】
プル デザイン プルデザイン | WEBやグラフィックデザイン情報サイト
スライダープラグイン【slick】を使って全画面スライドショーを実装。 「slickの実装方法」と「slickのカスタマイズ」につい …
