根据您滚动页面的距离来更改div

Question

我试图根据您滚动页面的距离来更改div中的文本.我一直在修补jQuery的scrollTop和文档高度,但迄今为止未能产生预期的结果.

如何在页面上获取元素的位置,然后在滚动到元素位置后让jQuery执行某些操作？

非常感谢帮助!

Answer 1

Stackoverflow上有一个问题,它提出了类似的问题,我掀起了一个小例子来说明如何实现这一点.我现在找不到问题,但这 是一个例子.在此示例中,将显示一个div,直到您滚动到页面中的某个元素,此时div被隐藏.你可以改变它来实现你想要的,因为这个想法是一样的.以下是根据您的需要修改的代码:

$(document).ready(function() {
    function isScrolledIntoView(elem) {
        var docViewTop = $(window).scrollTop();
        var docViewBottom = docViewTop + $(window).height();

        var elemTop = $(elem).offset().top;
        var elemBottom = elemTop + $(elem).height();

        return ((elemBottom >= docViewTop) && (elemTop <= docViewBottom));
    }

    var myelement = $('#formcontainer'); // the element to act on if viewable
    $(window).scroll(function() {
        if(isScrolledIntoView(myelement)) {
            // do something when element is scrolled to and viewable
        } else {
            // do something when element is not viewable
        }
    });
});