如何替換HTML上課的時候滾動使用jQuery

<<header> 
<nav class="navbar navbar-default top-postion navbar-up" role="navigation"> 
    <div class="container-fluid"> 
<!-- Brand and toggle get grouped for better mobile display --> 
<div class="navbar-header"> 
    <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"> 
    <span class="sr-only">Toggle navigation</span> 
    <span class="icon-bar"></span> 
    <span class="icon-bar"></span> 
    <span class="icon-bar"></span> 
    </button> 
    <a class="navbar-brand" href="#"><img src="images/kotakku-icon.png"> Kotakku</a> 
</div> 

<!-- Collect the nav links, forms, and other content for toggling --> 
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> 

    <ul class="nav navbar-nav navbar-tabs navbar-right navbar-menu" role ="tablist"> 
    <li><a href="#home">Home</a></li> 
    <li><a href="#product">Product</a></li> 
    <li><a href="#team">Team</a></li> 
    <li><a href="#contact">Contact</a></li> 

    </ul> 
</div><!-- /.navbar-collapse --> 
    </div><!-- /.container-fluid --> 
</nav>

如何替換HTML上課的時候滾動使用jQuery

如何使用導航欄下拉時滾動更換導航欄補課，並在滾動時再返回類的網頁

來源

2014-10-09 Faisal Ayas

姑娘就可以實現與toggleClass這種簡單的方法：

$('nav').toggleClass("navbar-up navbar-down");

而且你可以把這個代碼裏window滾動處理程序：

$(window).scroll(function() {  
    // some logic here 
});

終極密碼：

$(window).scroll(function() {  

    var scroll = $(window).scrollTop(); 

    // you can do your own condition here 
    if (scroll == 0) 
    { 
     $('.navbar-down').toggleClass("navbar-up navbar-down"); 
    } 
    else 
    { 
     $('.navbar-up').toggleClass("navbar-up navbar-down"); 
    } 

});

時的資產淨值有navbar-up類和滾動到navbar-up這種方式改變爲navbar-down且當其具有navbar-down VS和滾動到頂部，然後它改變navbar-up

你可以看到演示：http://jsfiddle.net/rdutuynb/

來源

2014-10-09 06:21:46

請用完整的代碼 – 2014-10-09 06:25:51

解釋當然我會編輯答案 – 2014-10-09 06:26:12

我已經更新了th e應答，這應該工作 – 2014-10-09 06:30:55

頂部

您可以使用scroll()檢測滾動，removeClass()去除類和addClass()添加新類：

$("header").scroll(function(){ 
    $(this).find("nav").removeClass("navbar-up").addClass("navbar-down"); 
});

來源

2014-10-09 06:21:35

可以使用removeClass和ADDC事件

element.removeClass("navbarup").addClass("navbar-down");

來源

2014-10-09 06:21:38

DEMO FIDDLE

$(window).scroll(function (event) { 
    $('nav').removeClass("navbar-up").addClass("navbar-down"); 
});

來源

2014-10-09 06:27:31 Jinandra

如何替換HTML上課的時候滾動使用jQuery

回答

相關問題