ヘッダーの背景色を変更して特定のポイントの後にロゴを追加する

私は、背景色を透明から黒に変更し、ポイントスクロール後にロゴを追加する必要があるWebページで作業しています。私はjavascriptを使い慣れていないので、これにいくつか問題があります。ヘッダーの背景色を変更して特定のポイントの後にロゴを追加する

例：http://www.asi.media/

現在、私は色を変えることで、こだわっているだけでなく、画像を表示する方法を見つけ出すことはできません。
私はブラウジングが見つかりましたが、動作していないソリューションは複数試しました。

少しお手伝いできますか？

HTML：

<body> 
    <img src="pictures/placeholder1.jpg" id="first_image"> 
    <header> 
     <img src="pictures/logo.png"> 
     <nav> 
      <ul> 
       <li><a href="#">PROIZVODI</a></li> 
       <li><a href="#">O GALERIJI</a></li> 
       <li><a href="#">O NAMA</a></li> 
       <li><a href="#">TIM</a></li> 
       <li><a href="#">KONTAKT</a></li> 
      </ul> 
     </nav> 
    </header> 
    <main> 


    </main>

CSS：

header { 
    width: 100%; 
    height: 20%; 
    font-weight: bold; 
    position: fixed; 
    font-size: 14px; 
    z-index: 100; 
    background-color: transparent; 
} 

header img { 
    float: left; 
    margin-left: 15%; 
    height: 80%; 
    margin-top: 5px; 
    display: none; 
} 

#first_image { 
    width: 100%; 
    min-width: 1024px; 
    position: fixed; 
    top: 0; 
    left: 0; 
    z-index: -2; 
}

のJavascript（jQueryの）：

$(document).ready(function(){ 
    $(window).scroll(function() { 
     if ($(document).scrollTop() > 600) { 
      $("#header").css("background-color", "black"); 
     } else { 
      $("#header").css("background-color", "transparent"); 
     } 
    }); 
});

出典

2016-11-26 Antonio Gvardijan

'$（ 'header'）' $（ '＃header'） 'でなければなりません。 – Thielicious

@Thieliciousそれでも動作しません... –

私の答えをチェック@Antonio Gvardijan – Thielicious

$(window).scroll(function() { 
    if ($(this).scrollTop() > 600) { 
    $("header").css("background", "black"); 
    $("header img").css('visibility','visible'); 
    } else { 
    $("header").css("background", "transparent"); 
    $("header img").css('visibility','hidden'); 
    } 
});

https://jsfiddle.net/Thielicious/jykvt19k/

出典

2016-11-26 18:31:40 Thielicious

ヘッダーの背景色を変更して特定のポイントの後にロゴを追加する

答えて

関連する問題