滾動條與圖片移動
阿新 • • 發佈:2020-12-27
<html> <title>xxx</title> <head></head> <body> <div id="out" style="width:100%;height:1300px;position: absolute;"> <hr /> <div style="width:100%;height:100%"> <img id="sImg" src="../Pictures/th.jpg" style="width: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>