繁体   English   中英

jQuery悬停功能无法正常工作

[英]jQuery hover function not working correctly

所以我只是想做一个简单的jquery效果,但是.hover函数的第二部分有问题。 这是代码:

<div id="toprightboxes">
<ul>
    <li><div id="login"><img src="img/login.png"/></div></li>
    <li>info</li>
    </ul>
</div>
<script>
    $("#login").hover(
        function () {
            $(this).replaceWith('<div id="login"><img src="img/loginhighlight.png"/></div>');
        },
        function () {
            $(this).replaceWith('<div id="login"><img src="img/loginhighlight.png"/></div>');
        }
    );
</script>

悬停的第一部分起作用,并且高亮显示图像,但是当我移开图像时,什么也没有发生。

嗯,您换回的是同样的图像...

其次,为什么要使用jQuery来实现这种悬停效果? 您可以使用a:hover {}和纯CSS轻松完成此操作。

我认为你有一个错字-你对事件mouseleave是一样的一个mouseenter 这是你的意思吗?

<div id="toprightboxes">
<ul>
    <li><div id="login"><img src="img/login.png"/></div></li>
    <li>info</li>
    </ul>
</div>
<script>
    $("#login").hover(
        function () {
        $(this).replaceWith('<div id="login"><img src="img/loginhighlight.png"/></div>');
        },
        function () {
        $(this).replaceWith('<div id="login"><img src="img/login.png"/></div>');
                }
    );
</script>

但是,如果您要做的只是更改图像,则可能要考虑使用CSS。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM