如何替换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

回答

相关问题