Javascript 如何在不影响其他按钮位置的情况下使图像按钮在悬停时突出

我有一个简单的脚本：

我希望当我悬停一个特定的按钮时，它的大小会被放大，并且按钮会在其他按钮的顶部突出，而不是像上面的jsfiddle那样影响其他按钮的位置

<img src='http://cdn.mxpnl.com/site_media/images/partner/badge_light.png' />
<img src='http://cdn.mxpnl.com/site_media/images/partner/badge_light.png' />
<img src='http://cdn.mxpnl.com/site_media/images/partner/badge_light.png' />

<script>
jQuery('img').hover(function() {
    $(this).attr('width', '200px');
}, function() {
    $(this).attr('width', '100px');
});
</script>

jQuery（'img'）。悬停（函数（）{
$（this.attr（'width'，'200px'）；
}，函数（）{
$（this.attr（'width'，'100px'）；
});

在悬停状态下，我尝试将css位置设置为固定位置，请尝试此新的jsfillde-

CSS代码

img{
    width: 100px;
}
img:hover{
    width:200px;
    position: fixed
}

HTML代码

<p>This is just a test</p>
<img src='http://cdn.mxpnl.com/site_media/images/partner/badge_light.png' />
<img src='http://cdn.mxpnl.com/site_media/images/partner/badge_light.png' />
<img src='http://cdn.mxpnl.com/site_media/images/partner/badge_light.png' />

这只是一个测试

---

在悬停状态下，我尝试将css位置设置为固定位置，请尝试此新的jsfillde-

CSS代码

img{
    width: 100px;
}
img:hover{
    width:200px;
    position: fixed
}

HTML代码

<p>This is just a test</p>
<img src='http://cdn.mxpnl.com/site_media/images/partner/badge_light.png' />
<img src='http://cdn.mxpnl.com/site_media/images/partner/badge_light.png' />
<img src='http://cdn.mxpnl.com/site_media/images/partner/badge_light.png' />

这只是一个测试

---

更改了您的代码。请尝试此

CSS：

.img{
    float:left;
    margin:0px 10px;
    position: fixed;
    top:10px;

}
.img1{
    left:0px;
    z-index:3;

}
.img2{
    left:120px;
     z-index:2;

}
.img3{
    left:240px;
     z-index:1;
}

---

已更改代码。请尝试此

CSS：

.img{
    float:left;
    margin:0px 10px;
    position: fixed;
    top:10px;

}
.img1{
    left:0px;
    z-index:3;

}
.img2{
    left:120px;
     z-index:2;

}
.img3{
    left:240px;
     z-index:1;
}

---

首先，我强烈建议您使用纯CSS

第二，我认为你可以通过规模来实现这一点：

你可以自己玩这个比率。注意，我添加了一个marign，这样图像就不会离开屏幕

---

首先，我强烈建议您使用纯CSS

第二，我认为你可以通过规模来实现这一点：

你可以自己玩这个比率。注意，我添加了一个marign，这样图像就不会离开屏幕

宽度CSS2：

宽度CSS2：

---

不要更改大小，而是更改边框和/或BGcolor添加一个边框，如@Satpal他特别要求按钮突出，而不是添加边框颜色不要更改大小，而是更改边框和/或BGcolor添加一个边框，如@Satpal他特别要求按钮突出，而不是添加边框颜色如果你保持位置不变“绝对”有助于在不影响其他图像的情况下更改悬停按钮的视图，此外，如果您将位置保持为“绝对”，还可以使用边框或阴影或其他图像高亮显示按钮“它有助于在不影响其他图像的情况下更改悬停按钮的视图，此外，您可以使用边框或阴影或其他图像突出显示按钮。我多么喜欢这些按钮，我看不出它们与问题相关。因为我找不到OP想要的效果。我多么喜欢这些按钮，我看不出它们与这个问题相关。因为我找不到OP想要的效果。