Web制作

CSS

レスポンシブにおいて改行タグbrをCSSで無効にするやり方

PC表示の時に使用していた<br>タグをスマホなどのレスポンシブ表示の時には使いたくない場合、CSSで<br>を無効にすることができます。 CSSで無効にするコード 以下のように記述します。 br...
JavaScript

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

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

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

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

CodePenのCSSでExpected newlineというエラーが出た時

CodePenでCSS(Scss構文)を書いていると、 というエラーが出て全くコンパイルされないことがありました。 調べてみたら、CSSのCSS Preprocessor設定でSCSSを選択するべきところをSassを選...
JavaScript

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

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

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

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