scrollTop在Firefox中无法正常工作？

问题描述：

所以我的问题是，代码在Chrome中起作用，但在Firefox中它总是display:none，。任何建议有什么不对？scrollTop在Firefox中无法正常工作？

$(document).on('scroll', function() { 

      if($(this).scrollTop()>=$('.compare-wrapper').position().top){ 
       $('.compare-menu-fixed').css('display','block'); 
      } 
      else{ 

       $('.compare-menu-fixed').css('display','none'); 

      } 
});

把你的HTML代码。制作小提琴或片段可帮助您更快地获得答案 – Mojtaba

答

你必须使用offset().top去，直到.compare-wrapper在您的div放在离顶部的距离。尝试如下，

.position（）方法允许我们检索元素相对于偏移父级的当前位置。将其与 .offset（）进行对比，该文件检索相对于文档的当前位置。

$(document).on('scroll', function() { 
 

 
    if($(this).scrollTop()>=$('.compare-wrapper').offset().top){ 
 
      $('.compare-menu-fixed').css('display','block'); 
 
     } 
 
    else{ 
 
     $('.compare-menu-fixed').css('display','none'); 
 
     } 
 
});

body{ 
 
    height:1600px; 
 
} 
 
.compare-wrapper{ 
 
    width:400px; 
 
    height:400px; 
 
    background:#111; 
 
    margin-top:100px; 
 
    position:relative; 
 
} 
 
.compare-wrapper > .compare-menu-fixed{ 
 
    width:200px; 
 
    height:200px; 
 
    background:#f22; 
 
    display:none; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="compare-wrapper"> 
 
<div class="compare-menu-fixed"></div> 
 
</div>

scrollTop在Firefox中无法正常工作？

相关推荐