javascript - 如何在鼠标悬停在文字上时添加效果

Question

我需要在鼠标悬停时为文本添加效果。

我的 js 代码:-

var j = jQuery.noConflict();
j(document).ready(function() {
j('.related_box ul li').hover(function(event) {
j(this).stop().animate({ right: "-5px" }, {duration: 'slow',easing: 'easeOutElastic'});
}
,
function(){
j(this).stop().animate({ right: "-75px" }, {duration: 'slow',easing: 'easeOutElastic'});
});
});

HTML 代码:-

<div class="related_box">
<ul class="related_list_ul">
<li class="related_list"><h3><a href="#"></a><span>«</span> About us</h3></li>
<li class="related_list"><h3><a href="#"></a><span>«</span> Call us</h3></li>
<li class="related_list"><h3><a href="#"></a><span>«</span> Contact us</h3></li>
</ul>
</div>

如何在鼠标悬停在文字上时添加效果。

Answer 1

您需要确保要设置动画的元素是position: relative; 或position: absolute;，否则更改right won '没有任何影响。