当另一个元素滚动到视口中时向按钮添加类

Question

我有一个静态按钮和一个滚动元素。 当可滚动元素进入浏览器视口时，我希望静态按钮获得一个类（例如下划线）。 我现在有这个，但它不起作用：

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

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

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

jQuery(window).scroll(function () {
    jQuery('#my-scrolling-element').each(function () {
        if (isScrolledIntoView(this) === true) {
            jQuery('#my-static-button').addClass('my-class');
        }
    });

});

任何帮助将非常感激

Answer 1

如果您想将类添加到输入类型的元素，那么下面的代码将起作用。

 jQuery(window).scroll(function() { element = jQuery('#my-scrolling-element'); if (isScrolledIntoView(element) === true) { jQuery('#my-static-button') //if the type of element is input then it will work. $("input[id^='my-scrolling-element_']").addClass('my-class'); } else { jQuery('#my-static-button').removeClass('my-class'); } }); //OR jQuery(window).scroll(function() { element = jQuery('#my-scrolling-element'); if (isScrolledIntoView(element) === true) { jQuery('#my-static-button').addClass('my-class'); } else { jQuery('#my-static-button').removeClass('my-class'); } });