javascript - 滚动页面时更改图像位置

Question

我是 javascript 的新手，想创建一个 HTML 页面，并想制作一个像 float 在我的页面上的图像，当用户在网站上上下滚动时它会进行交互，但我就是想不通。任何人都知道如何处理它？<​​/p>

            <script>


            $(window).scroll(function () { 
                //You've scrolled this much:
                // $('p').text("You've scrolled " + $(window).scrollTop() + " pixels");
                var doc = doc
                var x = document.getElementsByClassName("ImageTesting");
                //x.style.top =  "$(window).scrollTop()";
                x.css({'top': $(window).scrollTop() +'px'});

                console.log($(window).scrollTop() + "px")
                //console.log(x.style.top)
            });



            </script>

Answer 1

您可以使用 css's sticky property 实现相同的行为

.ImageTesting {
  position: -webkit-sticky; /* safary */
  position: sticky;
  top: 0;
}