マウスオーバーでの画像切り替えをJavaScriptで簡単に対応
2024/03/04
マウスが要素にのった際に画像を切り替える処理を入れたかった。多分CSSの管轄なんだろうけどCSSよく分かってないので手を出しづらい。
また、jQueryやJavaScriptでいちいち書いていくのも面倒くさいなぁと思って探したら以下の一文でいけるみたい。
ソースコード
<img src="初期表示画像" onmouseover="this.src='切り替え時表示画像'" onmouseout="this.src='初期表示画像'">
mouseover
https://developer.mozilla.org/ja/docs/Web/API/Element/mouseover_event
関連記事
-
-
textareaを自動でリサイズしてくれる「ExpandingTextareas」プラグインの利用方法
textareaのheight以上に文字を(複数行)入力しても当然heightの ...
-
-
エリア→都道府県→路線→駅名を連携する絞り込みセレクトメニューの設置方法
エリア→都道府県→路線→駅名のドリルダウン検索をプルダウン形式で設置したい。以前 ...
-
-
さくらのレンタルサーバでCookieが正常に保存できない場合の対応方法
さくらインターネットのレンタルサーバでjquery.cookie.jsを用いてC ...
-
-
Javascript / jQueryにて特定の要素内の文字数が〇文字以上の場合に丸める方法
サイトの特定の要素内の文字数が〇文字以上の場合に「コンテンツコンテ……」のように ...
-
-
ブラウザの広告ブロッカーを検知し、ブロックしている場合は何らかの処理を行う方法
普段何らかのサイトを見る際はAdBlock等の広告ブロッカー系プラグインを導入し ...