页面卡顿可否考虑函数节流？

if($(window).height() > 550){
    var top  = 240,
        timer = 0;                    
    if($(document).scrollTop() > top){
        var beforeScroll=$(document).scrollTop();
        var topIframe = -180;
        $("#SearchPackageLeftp").css({"position": "fixed","top": topIframe});
        $(window).scroll(function(){
            if (timer === 0) {
                timer = setTimeout(function() {
                    timer = 0;
                    var afterScroll=$(document).scrollTop();
                    var result=afterScroll-beforeScroll;
                    if(result<0){
                        var downIframe=10;
                        $("#SearchPackageLeftp").css({"position": "fixed","top":downIframe});
                    }
                    beforeScroll=afterScroll;    
                }, 500)
            }
            
        });
    }else{
        $("#SearchPackageLeftp").css({"position": "relative","top": "0px"});
    }
}

我感觉是不是可以考虑监听window的scroll事件 如果scrollTop达到一定的高度就给左边p一个fixed定位 小于这个高度就取消fixed

尝试用 translate 代替设置 top 并且包在 requestAnimationframe 里，看能不能解决卡顿。

已经解决

        function scrollHeight(topIframe){
            var top  = 240;    
            var timer=0;
            if($(document).scrollTop() > top){
                var beforeScroll=$(document).scrollTop();
                $("#SearchPackageLeftp").css({"position": "fixed","bottom": topIframe});
                $("#SearchPackageLeftp").css("top","");
                $(window).scroll(function(){
                    if(timer===0){
                        timer=setTimeout(function() {
                        timer=0;
                        var afterScroll=$(document).scrollTop();
                           var result=afterScroll-beforeScroll;
                        if(result<0){
                            $("#SearchPackageLeftp").addClass("scrollstyle");
                            if($(document).scrollTop()<top){
                                var downIframe=0;
                                $("#SearchPackageLeftp").css({"position": "relative","bottom":downIframe});
                            }
                        }else{
                            $("#SearchPackageLeftp").removeClass("scrollstyle");
                        }
                           beforeScroll=afterScroll;
                        },0)
                    }
                });    
            }else{
                $("#SearchPackageLeftp").css({"position": "relative","bottom": "0px"});
            }                
        }