<html>
<title>xxx</title>
<head></head>
<body>
<div id="out" style="100%;height:1300px;position: absolute;">
<hr />
<div style="100%;height:100%">
<img id="sImg" src="../Pictures/th.jpg" style="1200px;height:400px;position:absolute" />
</div>
</div>
</body>
<script>
var yValue = 0;
window.onscroll = scrollBottomOrTop;
function scrollBottomOrTop() {
if (yValue > window.scrollY) {
var temp = yValue - window.scrollY
move(temp);
} else {
var temp = yValue - window.scrollY
move(temp);
}
yValue = window.scrollY;
console.log(yValue);
}
var img = document.getElementById("sImg");
img.top = 0;
function move(k) {
if (k > 0) {
img.top = img.top - Math.abs(k);
} else {
img.top = img.top + Math.abs(k);
}
return img.style.top = img.top + 'px';
}
</script>
</html>