マウスオーバーでの画像切り替えを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
関連記事
-
-
バニラJS対応(jQuery非依存)の画像遅延読み込みプラグイン「echo.js」の利用方法
あるサイトをブラウザの開発者ツールで見ていると「echo.js」と聞いたことの無 ...
-
-
JavaScriptで多次元連想配列
JavaScriptで多次元の配列を作る際にいつも迷ってしまうのでメモ。 ■こう ...
-
-
ajaxのエラー詳細を取得する
success or errorで分岐処理はできるけど、 エラー詳細取れないの？ ...
-
-
JavaScriptにて数値のカウントアップ及びカウントダウンを表示する「countUp.js」ライブラリの利用方法
だいぶ前にバニラJSにて数値のカウントアップ及びカウントダウン表示を行う方法をメ ...
-
-
さくらのレンタルサーバでCookieが正常に保存できない場合の対応方法
さくらインターネットのレンタルサーバでjquery.cookie.jsを用いてC ...