jqueryスライドアップに関する問題 - slidedown - divが表示されない

Question

jquery SlideDownにいくつか問題があります。 私は問題が表示されていると思う：cssのどれもが、私はdivを隠して起動する必要があります。

HTML

<div id="miao">CIAO</div> 

jQueryの

var screenok = $(window).height(); 
    $(document).scroll(function() { 
    if ($(this).scrollTop() < screenok/3) { 
      $("#miao").slideUp(200); 
     } else { 
      $("#miao").slideDown(200); 
     } 

    }); 

CSS

  #miao{ height: 100px; 
      width: 100%; 
      position: fixed; 
      top: 0px; 
      left:0px; 
      z-index:20; 
      background:white; margin:auto; display:none;} 

JSFIDDLEのLINK

https://jsfiddle.net/vtxLqjkw/1/

代わりに要素のデフォルトのスタイルにdisplay:noneを維持する、あなたのCSSからそのプロパティを削除して、このような$(document).ready()にそれに.hide()を呼び出すことができ、非常に

Answer 1

ありがとう：

$(document).ready(function() { 
    var screenok = $(window).height(); 

    // hide the element initially 
    $("#miao").hide(); 
    $(document).scroll(function() { 
    if ($(this).scrollTop() < screenok/3) { 
     $("#miao").slideUp(200); 
    } else { 
     $("#miao").slideDown(200); 
    } 
    }); 

}); 

.hide()ファンクションは要素にdisplay:noneを設定します。そのため、効果的にスタイルを実行しています。永続的なプロパティ値にしないでください。