Anotherマウスオーバーで画像置換(メモ程度)

マウスオーバーで画像を置換するスクリプト。
世の中にたくさんあるものの、コレといって決め手に欠けるモノがほとんど。

結局、
<img src="someimage.jpg" onmouseover="javascript:this.src='someimage_o.jpg'" onmouseout="javascript:this.src='someimage.jpg'" />
なんてベタ書きするのが最強な気もする。
が、とりあえず使えそうなコードを書いてみたもののいまいち発展のさせ方が思いつかないのでメモ。

<img src="1a643c58.jpg" width="768" alt="画像" height="472"
 onmouseover="javascript:(function(img,suffix){
   var imgsrc=img.src;
   var imgsrc_o=imgsrc.replace(/^(.*?)(\x2e)([^\x2e]+?$)/,'$1'+suffix+'$2$3');
   img.src=imgsrc_o;
   if (!img.onmouseout) { img.onmouseout=function(){ img.src=imgsrc; } }
  })
 (this,'_o');"
 />
 

Leave a Reply