2016-07-08 4 views
0

私はプラットフォーム(Zoey Commerce)でホストされている電子商取引のWebサイトを持っています。このウェブサイトでは、CSSの要素(ヘッダーナビゲーション)をページの上部に固定するためにCSSを適用する非常にシンプルなjQueryがあるため、スクロール時にスティッキーなナビゲーションが作成されます。スティッキーナビゲーションの問題 - 「位置:固定」おそらく有効にならない

問題は、ヘッダーナビゲーション要素がページの上部に固定されていますが、ブラウザのスクロールでは移動していないということです。これは通常はposition: fixedとして実行されません。

何が起こっているかを見るためにここにウェブサイトをご覧ください。

http://ts367609-container.zoeysite.com/

参照してください以下の私のコード:

<script> 
var num = 10; //number of pixels before modifying styles 

jQuery(window).bind('scroll', function() { 
    if (jQuery(window).scrollTop() > num) { 
     jQuery('#global-wrapper-cp-142f9c37e921e052ae02cddde9be836b').addClass('fixed'); 
    } else { 
     jQuery('#global-wrapper-cp-142f9c37e921e052ae02cddde9be836b').removeClass('fixed'); 
    } 
}); 
</script> 

CSS:コードはcouldn

#pix-fe .fixed { 
    position: fixed !important; 
    z-index: 9999 !important; 
    margin-top: 0 !important; 
} 

」はるかに簡単なので、私は電子商取引プラットフォームposition: fixedが誤動作しています。誰も私が逃した何かを見つけることができますか?これを見ていただきありがとうございます。私は事前に回答をいただきありがとうございます。

+0

それはあなたのマージン左にやるべきことがたくさんあります。#pix-に-1100%を。私はあなたがそこからそれを理解することができると思います:)。 – RMo

+0

ありがとうございます。私はこれを調べます。 –

答えて

0

代わりif..else

このような
$window.scroll(function() { 
    $('#global-wrapper-cp-142f9c37e921e052ae02cddde9be836b').toggleClass('fixed', $(window).scrollTop() > num); 
}); 

toggleClassを使用してみてください、それが役に立てば幸い:)

+0

ありがとうございます。私はこれを見てあなたに知らせるでしょう。 –

関連する問題