<html>
<head>
<title></title>
</head>
<body>
<a href="#" class="readmore">View about <span class="arrow">→</span></a>
<script src="//code.jquery.com/jquery-1.9.1.js"></script><!-- jquery -->
<script src="//code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script>
var $readmore = $('.readmore');
var $arrow = $('.arrow');
$arrow.hide();
$readmore.mouseenter(function (){ $('.arrow').toggle('slide')}).mouseleave(function (){
$('.arrow').hide();
});
</script>
</body>
</html>
箭头从左侧滑动，这是正确的 但是箭头从文本的底部开始，这不是我想要的 它应该从文本旁边开始。
有谁知道为什么会这样？
提前致谢！
答案 0 :(得分：3)
这是CSS的一种方式。
.readmore {
display: inline-block;
position: relative;
}
span.arrow {
position: absolute;
top: 0;
right: -20px;
}
答案 1 :(得分：2)
有谁知道为什么会这样？
jQueryUI slide效果会在元素周围创建<div>并在 上执行滑动。< / p>
为什么 有意义？因为<div>的{{1}} display:默认情况下会创建一个新行，因此会将其置于动画开头的字母下。
在完成动画之后，jQuery将获取元素的原始block属性，无论是display:，block还是其他属性，并再次恢复它。因此，再次将它恢复到同一条线。
.toggle() PS - 我知道你已经接受了他的答案，但我认为你可能也想要解决你的实际问题。