Question

我希望div中的图像在用户滚动时垂直向下移动。它必须仅在页面的末尾结束。从另一篇文章中使用了下面的脚本解决方案，但它没有帮助。

HTML

<div id="wrapper">
   <img src="images/samp_scroll.png" class="ïmage">
</div>

CSS：

#wrapper {
    position: absolute;
}
.image {
    width: 560px;
    height: 700px;
}

脚本：

window.onscroll = function (e) {
  var vertical_position = 0;
  if (pageYOffset)//usual
    vertical_position = pageYOffset;
  else if (document.documentElement.clientHeight)//ie
    vertical_position = document.documentElement.scrollTop;
  else if (document.body)//ie quirks
    vertical_position = document.body.scrollTop;
console.log( vertical_position);
  var your_div = document.getElementById('wrapper');
  your_div.top = (vertical_position + 200) + 'px';//200 is arbitrary.. just to show you could now position it how you want
}

我在这做错了什么？进一步验证，虽然我可以获得控制台值 vertical_position 但我不能使用下面的代码移动div。

var your_div = document.getElementById（＆＃34; wrapper＆＃34;）; your_div.top = 400 +＆＃39; px＆＃39;;

还有其他最好的方法来处理用DIV移动html元素吗？有哪些文章解释？我真的很陌生。请帮帮我。

在顶部之前添加样式，工作。但是看起来样式只应用一次，因为它在我滚动时只移动一次。任何想法。

Answer 1

一个小小的错过，应该是style.top：

your_div.style.top = (vertical_position + 200) + 'px';

Answer 2

替换

var your_div = document.getElementById('wrapper');
your_div.top = (vertical_position + 200) + 'px';//200 is arbitrary.. just to show you could now position it how you want

带

$("#wrapper").css("top",(vertical_position + 200) + 'px');

使用纯javascript在滚动上移动div

2 个答案: