勉強したことのメモ

Webエンジニア / プログラマが勉強したことのメモ。

マウスオーバーでの画像切り替えをJavaScriptで簡単に対応

   2024/03/04  JavaScript

マウスが要素にのった際に画像を切り替える処理を入れたかった。多分CSSの管轄なんだろうけどCSSよく分かってないので手を出しづらい。

また、jQueryやJavaScriptでいちいち書いていくのも面倒くさいなぁと思って探したら以下の一文でいけるみたい。

 

ソースコード

<img src="初期表示画像" onmouseover="this.src='切り替え時表示画像'" onmouseout="this.src='初期表示画像'">

 

mouseover

https://developer.mozilla.org/ja/docs/Web/API/Element/mouseover_event

 - JavaScript

  関連記事

Leafletで表示したマップにジェスチャーハンドリングを追加する方法(Leaflet.GestureHandling)

GoogleMapをズームする際にPCだと「Ctrl+スクロール」、スマホだと「 ...

CKEditor(WYSIWYGエディタ)の設置方法と日本語化

今までWYSIWYGエディタを導入する際はNicEditを使用していたが、あんま ...

さくらのレンタルサーバでCookieが正常に保存できない場合の対応方法

さくらインターネットのレンタルサーバでjquery.cookie.jsを用いてC ...

AndroidのChromeでハマった点

Nexus7(Android4.3)のChromeでハマった。 iPhoneやG ...

JavaScriptでlocalStorageを簡単に操作できる「store.js」ライブラリの利用方法

以前Dexie.jsを利用してIndexedDBを取り扱う方法をメモしたが、今回 ...