Question

js自定义鼠标经过事件函数

求助用js 做鼠标经过函数,根据id="menu"当鼠标经过,提取img里面的src路径,分割路径,比如在"img/menu1"後面加上"_over"之後给onMouseOver,这个是我自己的思路但是不知道怎麼实现,页面上不要有js代码.页面结构如下,
<div id="menu">
<div class="img">

<img src="img/menu1.png" />

</div>

<div class="img">

<img src="img/menu2.png" />

</div>

<div class="img">

<img src="img/menu3.png" />

</div>
</div>

Answer 1

window.onload = function(){
	var menu = document.getElementById('menu');
	var img = menu.getElementsByTagName('img');
	menu.onmouseout = function(){
		for(var i=0;i<img.length;i++){
			var src = img[i].src;
			if(src.indexOf('_over')!=-1) {
				var index = src.lastIndexOf('.');
				img[i].src = src.substr(0,index-5)+src.substr(index,src.length);
			}
		}
	};
	menu.onmouseover = function(){
		for(var i=0;i<img.length;i++){
			var src = img[i].src;
			if(src.indexOf('_over')!=-1) continue;
			var index = src.lastIndexOf('.');
			img[i].src = src.substr(0,index)+'_over'+src.substr(index,src.length);
		}
	}
};

不谢，请叫我红领巾

追问

非常感谢,已经基本达到了,但是不应该是menu.onmouseout;这个div是最外层的,应该是img的div指向改变才对.要怎麼改?

追答

window.onload = function(){
    var menu = document.getElementById('menu');
var div = menu.getElementsByTagName('div');
for(var j=0;j<div.length;j++){
div[j].onmouseout = function(){
var img = this.getElementsByTagName('img')[0];

var src = img.src;
if(src.indexOf('_over')!=-1) {
var index = src.lastIndexOf('.');
img.src = src.substr(0,index-5)+src.substr(index,src.length);
}

};
div[j].onmouseover = function(){
var img = this.getElementsByTagName('img')[0];
var src = img.src;
if(src.indexOf('_over')==-1) {
var index = src.lastIndexOf('.');
img.src = src.substr(0,index)+'_over'+src.substr(index,src.length);
}
}
}
};

追问

如果当前的html代码里的img src="img/xxx_over.png";这个不需要在onmouseout时移除_over.怎麼判断?

追答

window.onload = function(){

    var menu = document.getElementById('menu');

 var div = menu.getElementsByTagName('div');

 for(var j=0;j<div.length;j++){

  div[j].onmouseover = function(){

   var img = this.getElementsByTagName('img')[0];

   var src = img.src;

   if(src.indexOf('_over')==-1) {

    var index = src.lastIndexOf('.');

    img.src = src.substr(0,index)+'_over'+src.substr(index,src.length);

   }

  }

 }

};

回答了这么久，你也给我套点咨询费什么的吧，哈哈。

追问

这个代码没有判断到吧!

追答

自己搞吧，你一句话我就要写这么多

Answer 2

描述真不清楚，你是要自定义图片的onMouseOver事件吧。在页面onload函数里给你想要的图片加上事件关联就可以了。