JQuery

CSS

【Swiper】ページネーションのカスタマイズ方法

Swiperのデフォルトのページネーションは前後のスライド矢印のようにカスタマイズ可能です。 この記事ではごくごく基本的なカスタマイズ方法をご紹介します。 なおSwiperそのものの実装方法や使い方については以下の記事を参照下...
CSS

【Swiper】前後のスライド矢印のカスタマイズ方法

Swiperでデフォルトで用意された前後のスライド矢印をカスタマイズして変更する方法をご紹介します。 なお基本的なSwiperそのものの実装方法についてはこちらの記事を参照下さい。 【2022最新】スライダープラグイン Swi...
JavaScript

【JQuery】【data関数】スクロールするモーダルウィンドウの作り方

プラグインを使わずにJQueryとdata関数を用いてスクロールするモーダルウィンドウを作る方法を紹介します。 そもそもモーダル(ウィンドウ)とは? モーダルとは以下画像のように「メインの画面に被るようにして表示される小さなウ...
JavaScript

スムーススクロールとは。JQueryを使った使い方を解説

スムーススクロールとは スムーススクロールとは、Webサイトのページ内のリンクをクリックすると、すぅーっと目的の場所まで移動してくれる演出のことで、よく目次の中のリンクをクリックするときに見られる演出のことです。 その名の通り...
JavaScript

【JQuery】ナビメニューがクリックされた時、現在地を下線で表示する方法(カレント表示)

カレント表示とは ヘッダー内のナビメニューをクリックした時、クリックされたメニューのみ下線表示して、現在地を表示する方法を「カレント表示」と言います。英語のcurrent(現在の)が由来なのでしょう。 下のResultにて各ヘ...
JavaScript

【2022最新】スライダープラグイン Swiper.jsの使い方

Web制作(コーディング)を学習していくと画像などをスライドさせる方法について学ぶ機会が訪れると思いますが、その中で今回はもっとも代表的なスライダーの一つであるSwiperの使い方について解説していきます。 ライブラリをCDNで読み...
タイトルとURLをコピーしました