2017-07-12 11 views
0

ページが最初に読み込まれたときにメニューを非表示にしてから、850pxを表示する必要があります。 www.ripplesofgrace.comをロードすると、メニューがすばやく点滅することを除いて、すべてうまく動作します。私はこれを避けたいと思います。助言がありますか?私のコードは、現在、次のとおりです。最初は。読み込み速度が十分でない

jQuery(function($){ 
    $(window).load(function(){ 
     $('#whiteBar').hide(); 
    }); 
}); 

jQuery(function($){ 
    $(window).scroll(function(){ 
    var aTop = $('#whiteBar').height()+850; 
    if($(this).scrollTop()>=aTop){ 
     $('#whiteBar').show(); 
     } else { 
     $('#whiteBar').hide(); 
    }; 
    }); 
}); 
+1

メニューを管理するCSSスタイルを変更できますか?初期可視性プロパティをhiddenに設定します。 –

+2

cssを使用して非表示にする – charlietfl

+0

"load"ハンドラの設定*を* jQueryの "ready"ハンドラのようなものにするのは意味がありません。おそらく、その '.hide()'呼び出しを他の初期化ハンドラの中に移動するだけです。 – Pointy

答えて

1

、インラインまたはスタイルシートのいずれかで、CSSのディレクティブを持つ要素を非表示にします。

#whiteBar { 
    display: none 
} 

これは、javascriptがそれに作用する機会を得る前に、それが見られる可能性はほとんどゼロになります。

+0

jqueryはそれを元に戻しますか? –

+0

もしあなたがその位置を失いたくなければ、 'display:none;'の代わりに 'visibility:hidden;'を使います。 – enzoborgfrantz

+0

@GordonArber、はい。 CSSとjavascript/jQueryの両方がDOM要素に作用します。 CSSディレクティブは、(一般的に)最初のDOMでHTMLで実行されるように動作する1回限りのものです。 Javascript.jQuery(一般に)は、後のイベントに応答して動作します。したがって、DOM要素にはさまざまな影響があります。どちらの影響が最後に笑いか、笑い声が最も大きい! –

関連する問題