Как скрыть изображение баннера, но при навигации прокручивать навигацию вверху?

Question

Im пытается заставить навигационную панель оставаться фиксированной в верхней части браузера, когда пользователь прокручивается вниз. Однако у меня есть изображение над навигацией, и мне бы хотелось, чтобы он прокручивался вверх, так что только навигационная панель остается при прокрутке.

Основная причина этого заключается в том, что при уменьшении размера окна логотип заканчивается тем, что покрывает большую часть экрана, и содержимое становится очень трудным для просмотра.

Это то, что я пытаюсь сделать: http://corp.ign.com/

Вот JSfiddle того, что я до сих пор: http://jsfiddle.net/cZKeG/

HTML:

<div id="topWrapper"> 
    <a href="index.html"> 
     <header id="top_header"> 
      <h1>MacroPlay Games</h1> 
     </header> 
    </a> 
    <nav id="topnav"> 
     <ul> 
      <li><a href="index.html">Home</a></li> 
      <li><a href="about.html">About</a></li> 
      <li><a href="video.html">Trailers</a></li> 
     </ul> 
    </nav> 
</div> 

CSS:

#topWrapper { 
    /*border:1px solid #00ffff;*/ 
    background-color:#0d0d0d; 
    text-align:center; 
    position:fixed; 
    z-index:9999; 
    width:100%; 
    max-width: 850px; 
    margin: 0 auto; left:0px; right:0px; 
    float:clear; 
    background-image: url('bg5.jpg');  
} 

Answer 1

Быстрый взгляд на предлагаемый вами код подсказывает вам, что вы делаете w отверстие topWrapper фиксируется, когда вы хотите только topnav быть исправлены

Попробуйте

#topnav { 
/*border:1px solid #00ffff;*/ 
background-color:#0d0d0d; 
text-align:center; 
position:fixed; 
z-index:9999; 
width:100%; 
max-width: 850px; 
margin: 0 auto; left:0px; right:0px; 
float:clear; 
background-image: url('bg5.jpg');  

}