[Hỏi đáp] Div bị ảnh hưởng khi chèn js menu trượt.

Ảnh demo:
Demo online: http://goo.gl/yq0Bm0

Js:

Code:

<script type="text/javascript">
$(window).scroll(function(){ if(window.pageYOffset>50){$('#navvv').attr('style','position:fixed;z-index:99999993;top:0px!important;border-top:none;border-bottom:3px solid #e85004;width: 100%; max-width: 100%;line-height: 30px;height:30px;border-radius: 0;')}else{$('#navvv').attr('style','')} });
$(window).scroll(function(){ if(window.pageYOffset>50){$('#navv li > a').attr('style','line-height: 30px;height:30px;')}else{$('#navv li > a').attr('style','')} });
$(window).scroll(function(){ if(window.pageYOffset>50){$('#navv li.active > a').attr('style','line-height: 30px; background: #359bed url(http://i.imgur.com/TFTMkd1.png) no-repeat 50% 50%;')}else{$('').attr('style','')} });
$(window).scroll(function(){ if(window.pageYOffset>50){$('#navv ul.subs').attr('style','top:30px;padding:0 2% 0 2%;z-index: 9999999999')}else{$('#navv ul.subs').attr('style','padding: 2%;top: 54px;z-index: 9999999999')} });
$(window).scroll(function(){ if(window.pageYOffset>50){$('#navv').attr('style','')}else{$('#navv ul.subs').attr('style','')} });
$(window).scroll(function(){ if(window.pageYOffset>50){$('#navv > li > a').attr('style','line-height: 30px;height: 30px;')}else{$('').attr('style','')} });</script>

Div vị ảnh hưởng:

Code:

<div class="logo010"><div class='jorib'>
<form class="form-wrapper search" action="/search" method="get">
  <input name="search_keywords" type="text" class="search-query span1" placeholder="Nhập từ khóa > Enter"/>
  <button type='submit1'>Search</button>
</form>

bị gì? Trước hết là xem lại cái js, đặt 5 cái conditions giống nhau...gộp lại thành 1 cho nhanh

Code:

$(document).scroll(function() {
    if ($(this).scrollTop() >= 100) { // scrolls down 100px
        // do something
    } else {
        // do something
    }
});

Vị trí ban đầu của nó:

muốn scroll xuống rồi cái nav hiện ra phải không?

Code:

$(document).scroll(function() {
    if ($(this).scrollTop() >= 100) { // scrolls down 100px
        $('#navvv').addClass('scrolling')
    } else {
        $('#navvv').removeClass('scrolling')
    }
});

Code:

#navvv {
position: fixed;
opacity: 0;
transition-duration: 1s;
}
.scrolling {
opacity: 1;
}