Question

当鼠标悬停在图像上时，我想将“imgTag.style.border='5px solid #FF00FF'”更改为黑色。这是我的JavaScript：

javascript:for(i=0;i<document.getElementsByTagName('img').length;i++)  
     {
     var imgTag=document.getElementsByTagName('img')[i];   
     imgTag.style.border='5px solid #FF00FF';
     imgTag.title=''; 
     imgTag.onclick=function()
          { 
         return !window.open('http://www.example.com/#/'+this.src);
          }
      }
    void(0)

怎么做？谢谢弗兰克

Answer 1

您需要将处理程序绑定到mouseover和mouseout事件以更改图像的边框颜色：

var imgs = document.getElementsByTagName('img');
for(var i = 0; i < imgs.length; ++i) {
    imgs[i].onmouseover = function() {
        this.style.borderColor = '#000';
    };
    imgs[i].onmouseout = function() {
        this.style.borderColor = '#f0f';
    };
}

例如：http://jsfiddle.net/bNk4Y/

Answer 2

不确定您的代码有什么问题，但如果我正确理解您的问题，则应该这样做： HTML：

<img src="" >
<img src="">
...

JS：

var imgs = document.getElementsByTagName("img");
for(i=0;i<imgs.length;i++)
{
    imgs[i].onmouseover = function() {this.style.border="1px red solid";};   
}

但请注意，使用CSS也可以很容易地实现这一点，这是一种更好的做法 - 以防用户禁用JS等等

img:hover {
border: 1px red solid;
}

用鼠标改变颜色

2 个答案: