我可以很容易地垂直移动图像,但如何使用我的方法水平移动它?我还希望图像一旦到达某个点就停止朝那个方向移动,我不知道该怎么做,也许我可以更改它的 css,以便在我下降这么多像素后保持在某个位置。
下面的代码垂直移动它,我可以使用类似的简单方法来水平移动图像吗?
代码:
$(window).on("scroll", function() {
var wScroll = $(this).scrollTop();
$('.planeImg').css({'transform' : 'translate(-50%, -'+ wScroll /2 +'%)'})
});
.planeImg {
position: absolute;
display: block;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
background: url("../images/plane.png");
background-size: contain;
background-repeat: no-repeat;
z-index: 99;
height: 80px;
width: 300px;
}
最佳答案
这很有效。
$('.planeImg').css({'transform' : 'translate( -'+ wScroll /2 +'%, -50%)'})
关于javascript - 滚动时水平移动图像,然后停止,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41459383/