我有一张图片,里面有一个 div,当鼠标悬停在图片上时会出现。我希望图像中的这个 div 的展示是动画的(慢的),从右到左。
到目前为止,我已经从左到右得到了它,但我就是不知道如何从右到左做到这一点。
HTML
<div id="container">
<div id="slider-div">
some text
</div>
<img id="image" src="img.png">
</div>
jQuery
$("#image").hover(function(){
$('#slider-div').animate({width:'toggle'},350);
});
CSS
#container {
background: red;
width: 200px;
height: 200px;
position: relative;
}
#image {
height: 170px;
width: 140px;
}
#slider-div {
background: green;
width: 50px;
height: 50px;
position: absolute;
display: none;
}
最佳答案
默认情况下,您的#slider-div 从左开始:0;位置。所以它会向右移动。如果你想让它离开,只需将你的#slider-div 放在开头,如 right:0;。
关于jquery - 在图像内从右向左滑动 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32493199/