我工作的大电子商务网站，我想贴在滚动菜单，我已经使用引导程序来实现与CSS，但它不是工作正常，这是我的代码大商贸坚守导航栏菜单

<div id="top-nav"> 
     <div class="CategoryList" id="TopCategoryList" data-spy="affix" data-offset-top="197" > 
      <div class="SideCategoryListClassic"> 
       <ul class="category-list" style="padding-top: 3px;"> 
        <li class=""><a href="/motorcycle-tire-warmers">MOTO-D Tire Warmers</a></li> 
        <li class=""><a href="/pro-series-motorcycle-stands">MOTO-D Stands</a></li> 
        <li class=""><a href="/cnc-motorcycle-parts">Bonamici Rearsets</a></li> 
        <li class=""><a href="/motorcycle-gps-lap-timer">MOTO-D "Next" GPS Lap Timer</a></li> 
        <li class=""><a href="/motorcycle-undersuits-and-baselayers">MOTO-D Undersuit</a></li> 
        <li class=""><a href="/spark-italy-exhaust-technologies">Spark Italy Exhausts</a></li> 
        <li class=""><a href="/performance-riding-motorcycle-accessories">Accessories</a></li> 
       </ul> 
      </div> 
     </div> 
     <div class="clear"></div> 
#top-nav.affix { 
    background-color: #333; 
    left: 0; 
    padding-bottom: 5px; 
    position: fixed; 
    right: 0; 
    text-align: center; 
    top: 0; 
    z-index: 2222;

}

This is my dummy site

预先感谢您的帮助

来源

2017-10-13 Rahul singh

是不是已经固定在顶部的导航栏？ –

是的，先生，但如果你看看我的虚拟网站，虽然滚动它并没有提供一个平滑的滚动http://motodummygmailcom6.mybigcommerce.com/?ctk=S5IH79487W1BH6L17GBF0 –

所以你想平稳过渡？ –

这即将CSS3，但它尚未公布。你可以阅读更多关于position: stickyhere。

与此同时，我会使用一些JavaScript来平滑过渡。

我只是猜测与scrollTop号码，所以根据需要调整它。

JQUERY

$(window).scroll(function(){ 
if ($(window).scrollTop() >= 60) { 
    $('top-nav').addClass('fixed'); 
} 
else { 
    $('top-nav').removeClass('fixed'); 
}

}）;

你也可以在plain ole JavaScript中做同样的事情，但是既然你已经加载了jQuery，不妨使用它！

来源

2017-10-13 19:12:51 Tricky

$（'。affix'）.css（{display：'none' }）; （'。affix-top'）.css（{'012''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''' –

大商贸坚守导航栏菜单

回答

JQUERY

相关问题