[英]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.