0

我是一个 jquery 菜鸟,并且在图像保持原位时遇到了麻烦。我有一个 jquery-hover 函数,它获取图像的 src 属性并将其替换为名为“over”的属性的值。实际的图像替换工作正常,但只要 mouseenter 事件触发,翻转图像就会出现在 y 轴下方约 10% 处。我正在寻找一个图像与另一个图像的完全重叠“替换”,而翻转图像不会出现在不同的位置。这是功能:

function createRollovers()
{
    var origImg ="";
    $(".swapImage").hover (
    function() {
        origImg = ($(this).attr("src"));
        $(this).attr("src", ($(this).attr("over")));
    },
    function() {
       $(this).attr("src", origImg);
    }
 );
}

HTML如下:

<div id="rightSide">
    <img class="swapImage" over="images/principlesBar_hover.jpg"  src="images/principlesBar.jpg" />
    <img class="swapImage" over="images/processBar_hover.jpg"  src="images/processBar.jpg" />
    <img class="swapImage" over="images/productsBar_hover.jpg"  src="images/productsBar.jpg" />
</div>

我敢肯定,这是一件非常简单的事情,更有经验的人会在心跳中看到。提前感谢您的帮助。

4

2 回答 2

0

是的,我同意阿特斯的观点。但是,CSS 悬停仅适用于某些浏览器中的锚标记,即 IE6 等。如果你想用简单的 JS 实现这个,你可以检查这个链接

于 2011-01-28T06:40:09.570 回答
0

你真的不需要 JavaScript/jQuery。尝试使用 CSS:hover伪类来更改元素的背景图像。

于 2011-01-28T05:55:22.033 回答