0

次のコードを使用して、スティッキー ナビゲーション メニューを作成しています。ページを下にスクロールするときに、このナビゲーションをフェードインしたいと思います（「固定」になったら）。不透明度、クラスの追加と削除を試しましたが、何もうまくいかないようです...

function fixDiv() {
  var $cache = $('#menu-1'); 
  if ($(window).scrollTop() > 150) 
    $cache.css({'position': 'fixed', 'top': '0px'}).addClass("mega-fixed"); 
  else
    $cache.css({'position': 'relative', 'top': 'auto'}).removeClass("mega-fixed");

}
$(window).scroll(fixDiv);
fixDiv();

上記の css 内で opacity 要素を使用してみました。「transition: all 1s」効果が追加された「mega-fixed」クラスに適用されます。ページを下にスクロールすると、スティッキー ナビゲーションがエレガントにフェードインします。ただし、ページを上にスクロールすると、ナビゲーションが消えます。コードを介してこれが発生している理由はわかりますが、修正できません...

4

1 に答える 1