【问题标题】:onmouseover and onmouseout to resize imagesonmouseover 和 onmouseout 调整图像大小
【发布时间】:2013-03-13 20:18:47
【问题描述】:

我试图将鼠标悬停在几张图片上,然后图片会调整大小,但不知何故,假设我有三张图片。如果我的鼠标在第一个图像上,那么所有三个都将调整大小如果我将鼠标悬停在第三个然后是第二个然后第一个然后它会一个一个地调整大小,而不是一次调整所有三个的大小。我刚开始使用javascript,所以还不太了解。 除非我知道更高级的方法,否则它是这样工作的吗?

我也想这样做,所以当我的鼠标不在时,图像会恢复到默认值,但我不知道该怎么做......

这就是我所拥有的……

<script>
var div1Images=document.getElementById("div1").getElementsByTagName("img");

for(i=0;i<div1Images.length;i++)
{
    div1Images[i].onmouseover=function()
    {
    this.style.width="100px";
    }
}
</script>

<body>
<div id="div1">
<img src="cat.jpg" id="im1"/>
<img src="dog.jpg" id="im2"/>
<img src="fish.jpg" id="im3"/>
</div><!--close div1-->
</body>

提前致谢。

【问题讨论】:

    标签: javascript onmouseover onmouseout


    【解决方案1】:

    你可以用 CSS 做到这一点:

    <img class="mypic" src="cat.jpg" id="im1"/>
    
    .myPic:hover {
          width:100px;
    }
    

    【讨论】:

    • 这就是我被要求做的,否则我也会去 css :P
    • 告诉一个朋友教我一些基本的 javascript,所以他教了我一点,并让我这样做,所以我猜你有点像一个作业,但不像它只是我在网上搜索的分数,但仍然想不通,所以我想在问他之前,我应该尝试在线问,因为这比他直接回答我更容易理解。
    • 你可以用 JS 来做,但 CSS 总是更高效。
    猜你喜欢
    • 2011-03-30
    • 2020-10-03
    • 1970-01-01
    • 2023-03-03
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-02-04
    • 2015-08-27
    相关资源
    最近更新 更多