首页 > 解决方案 > jquery $(document).on("scroll") 禁用

问题描述

到目前为止,我已经构建了一个在滚动时将 html 元素粘贴到页面顶部的函数,但我想在其中创建一个函数来销毁每个指定元素的 $(document).on("scroll")。有人可以帮我实现这一目标吗?到目前为止,我的代码是:

$(element).each(function() {
    var default_settings = {
        parent: null,
        offsetTop: 0,
        offsetBottom: 0,
        fixBottom: true
    };

    var elm = $(this),
        parent = $(settings.parent);

    var elmTop = elm.offset().top,
        elmLeft = elm.offset().left,
        elmWidth = elm.width(),
        elmHeight = elm.height(),
        parentTop = parent.offset().top,
        parentHeight = parent.outerHeight(true),
        offs = elmTop - settings.offsetTop,
        margin_top = elmTop - parentTop,
        margin_bottom = parentHeight - elmHeight - margin_top,
        diff = parentHeight - elmHeight + parentTop - settings.offsetTop - settings.offsetBottom;

    $(document).on("scroll", function(){
       var w_top = $(window).scrollTop();

        if(w_top > offs && w_top < diff) {
            elm.attr("style", "position: fixed; top: "+settings.offsetTop+"px; left: "+elmLeft+"px; margin-left: 0;");
            if(!elm.next('[data-sticket-controller]').length) {
                elm.after('<div data-sticket-controller style="visibility: hidden; opacity: 0; position: relative; width: '+elmWidth+'px; height: '+elmHeight+'px;"></div>');
            }
        }
        else if(w_top >= diff) {
            if(settings.fixBottom) {
                elm.attr("style", "position: absolute; bottom: "+settings.offsetBottom+"px; left: "+elmLeft+"px; margin-left: 0;");
            }
        }
        else {
            elm.removeAttr("style");
            elm.next("[data-sticket-controller]").remove();
        }
    }
    });
});

标签: jquerystickyonscroll

解决方案


推荐阅读