CodePen

HTML

            
              <div class="header-container">
</div>
<span class="menu-item">This is a fade test.</span>
<div id="slider-here">
    <img src="http://www.levelsofarcadia.com/wp-content/uploads/2013/01/ghost-recon-future-soldier.jpg" />
</div>
<div id="content-area">
    <p>Bacon ipsum dolor sit amet capicola chuck pancetta ground round beef ribs, ball tip jerky sirloin pork loin. Andouille pork chop turkey, sirloin doner drumstick chuck bresaola boudin t-bone. Pastrami short ribs bresaola, t-bone beef ribs corned beef tongue chuck pork loin pork chop. Pork belly meatloaf salami pork chop jerky jowl sausage hamburger frankfurter andouille shoulder shankle turkey boudin t-bone. Strip steak frankfurter bresaola, prosciutto pork spare ribs tail venison shank pork belly. Meatball andouille ribeye leberkas chuck t-bone venison strip steak brisket short loin corned beef drumstick tongue.</p>
    
        <p>Bacon ipsum dolor sit amet capicola chuck pancetta ground round beef ribs, ball tip jerky sirloin pork loin. Andouille pork chop turkey, sirloin doner drumstick chuck bresaola boudin t-bone. Pastrami short ribs bresaola, t-bone beef ribs corned beef tongue chuck pork loin pork chop. Pork belly meatloaf salami pork chop jerky jowl sausage hamburger frankfurter andouille shoulder shankle turkey boudin t-bone. Strip steak frankfurter bresaola, prosciutto pork spare ribs tail venison shank pork belly. Meatball andouille ribeye leberkas chuck t-bone venison strip steak brisket short loin corned beef drumstick tongue.</p>
    
        <p>Bacon ipsum dolor sit amet capicola chuck pancetta ground round beef ribs, ball tip jerky sirloin pork loin. Andouille pork chop turkey, sirloin doner drumstick chuck bresaola boudin t-bone. Pastrami short ribs bresaola, t-bone beef ribs corned beef tongue chuck pork loin pork chop. Pork belly meatloaf salami pork chop jerky jowl sausage hamburger frankfurter andouille shoulder shankle turkey boudin t-bone. Strip steak frankfurter bresaola, prosciutto pork spare ribs tail venison shank pork belly. Meatball andouille ribeye leberkas chuck t-bone venison strip steak brisket short loin corned beef drumstick tongue.</p>
    
        <p>Bacon ipsum dolor sit amet capicola chuck pancetta ground round beef ribs, ball tip jerky sirloin pork loin. Andouille pork chop turkey, sirloin doner drumstick chuck bresaola boudin t-bone. Pastrami short ribs bresaola, t-bone beef ribs corned beef tongue chuck pork loin pork chop. Pork belly meatloaf salami pork chop jerky jowl sausage hamburger frankfurter andouille shoulder shankle turkey boudin t-bone. Strip steak frankfurter bresaola, prosciutto pork spare ribs tail venison shank pork belly. Meatball andouille ribeye leberkas chuck t-bone venison strip steak brisket short loin corned beef drumstick tongue.</p>
    
        <p>Bacon ipsum dolor sit amet capicola chuck pancetta ground round beef ribs, ball tip jerky sirloin pork loin. Andouille pork chop turkey, sirloin doner drumstick chuck bresaola boudin t-bone. Pastrami short ribs bresaola, t-bone beef ribs corned beef tongue chuck pork loin pork chop. Pork belly meatloaf salami pork chop jerky jowl sausage hamburger frankfurter andouille shoulder shankle turkey boudin t-bone. Strip steak frankfurter bresaola, prosciutto pork spare ribs tail venison shank pork belly. Meatball andouille ribeye leberkas chuck t-bone venison strip steak brisket short loin corned beef drumstick tongue.</p>
    
        <p>Bacon ipsum dolor sit amet capicola chuck pancetta ground round beef ribs, ball tip jerky sirloin pork loin. Andouille pork chop turkey, sirloin doner drumstick chuck bresaola boudin t-bone. Pastrami short ribs bresaola, t-bone beef ribs corned beef tongue chuck pork loin pork chop. Pork belly meatloaf salami pork chop jerky jowl sausage hamburger frankfurter andouille shoulder shankle turkey boudin t-bone. Strip steak frankfurter bresaola, prosciutto pork spare ribs tail venison shank pork belly. Meatball andouille ribeye leberkas chuck t-bone venison strip steak brisket short loin corned beef drumstick tongue.</p>
    
     <p>Bacon ipsum dolor sit amet capicola chuck pancetta ground round beef ribs, ball tip jerky sirloin pork loin. Andouille pork chop turkey, sirloin doner drumstick chuck bresaola boudin t-bone. Pastrami short ribs bresaola, t-bone beef ribs corned beef tongue chuck pork loin pork chop. Pork belly meatloaf salami pork chop jerky jowl sausage hamburger frankfurter andouille shoulder shankle turkey boudin t-bone. Strip steak frankfurter bresaola, prosciutto pork spare ribs tail venison shank pork belly. Meatball andouille ribeye leberkas chuck t-bone venison strip steak brisket short loin corned beef drumstick tongue.</p>
    
        <p>Bacon ipsum dolor sit amet capicola chuck pancetta ground round beef ribs, ball tip jerky sirloin pork loin. Andouille pork chop turkey, sirloin doner drumstick chuck bresaola boudin t-bone. Pastrami short ribs bresaola, t-bone beef ribs corned beef tongue chuck pork loin pork chop. Pork belly meatloaf salami pork chop jerky jowl sausage hamburger frankfurter andouille shoulder shankle turkey boudin t-bone. Strip steak frankfurter bresaola, prosciutto pork spare ribs tail venison shank pork belly. Meatball andouille ribeye leberkas chuck t-bone venison strip steak brisket short loin corned beef drumstick tongue.</p>
    
        <p>Bacon ipsum dolor sit amet capicola chuck pancetta ground round beef ribs, ball tip jerky sirloin pork loin. Andouille pork chop turkey, sirloin doner drumstick chuck bresaola boudin t-bone. Pastrami short ribs bresaola, t-bone beef ribs corned beef tongue chuck pork loin pork chop. Pork belly meatloaf salami pork chop jerky jowl sausage hamburger frankfurter andouille shoulder shankle turkey boudin t-bone. Strip steak frankfurter bresaola, prosciutto pork spare ribs tail venison shank pork belly. Meatball andouille ribeye leberkas chuck t-bone venison strip steak brisket short loin corned beef drumstick tongue.</p>
    
        <p>Bacon ipsum dolor sit amet capicola chuck pancetta ground round beef ribs, ball tip jerky sirloin pork loin. Andouille pork chop turkey, sirloin doner drumstick chuck bresaola boudin t-bone. Pastrami short ribs bresaola, t-bone beef ribs corned beef tongue chuck pork loin pork chop. Pork belly meatloaf salami pork chop jerky jowl sausage hamburger frankfurter andouille shoulder shankle turkey boudin t-bone. Strip steak frankfurter bresaola, prosciutto pork spare ribs tail venison shank pork belly. Meatball andouille ribeye leberkas chuck t-bone venison strip steak brisket short loin corned beef drumstick tongue.</p>
    
        <p>Bacon ipsum dolor sit amet capicola chuck pancetta ground round beef ribs, ball tip jerky sirloin pork loin. Andouille pork chop turkey, sirloin doner drumstick chuck bresaola boudin t-bone. Pastrami short ribs bresaola, t-bone beef ribs corned beef tongue chuck pork loin pork chop. Pork belly meatloaf salami pork chop jerky jowl sausage hamburger frankfurter andouille shoulder shankle turkey boudin t-bone. Strip steak frankfurter bresaola, prosciutto pork spare ribs tail venison shank pork belly. Meatball andouille ribeye leberkas chuck t-bone venison strip steak brisket short loin corned beef drumstick tongue.</p>
    
        <p>Bacon ipsum dolor sit amet capicola chuck pancetta ground round beef ribs, ball tip jerky sirloin pork loin. Andouille pork chop turkey, sirloin doner drumstick chuck bresaola boudin t-bone. Pastrami short ribs bresaola, t-bone beef ribs corned beef tongue chuck pork loin pork chop. Pork belly meatloaf salami pork chop jerky jowl sausage hamburger frankfurter andouille shoulder shankle turkey boudin t-bone. Strip steak frankfurter bresaola, prosciutto pork spare ribs tail venison shank pork belly. Meatball andouille ribeye leberkas chuck t-bone venison strip steak brisket short loin corned beef drumstick tongue.</p>
</div>
            
          
!

CSS

            
              .header-container {
	background-color: #000;
    position: fixed;
    opacity: .5;
    top: 0;
    height: 100px;
    width: 100%;
}

#slider-here {
 background-color: #F60;
}

#slider-here img {
 height: auto;
 width: 100%;
 min-width: 100%;
}

#content-area p {
    padding: 10px;
}

span.menu-item {
  color: #FFF;
  font-size: 24px;
  padding-top: 20px;
  width: 20%;
  position: fixed;
  left: 40%;
  top: 20px;
  padding: 18px 20px;
  text-align: center;
  text-transform: uppercase;
  font-family: arial;
}
            
          
!
? ?
? ?
Must be a valid URL.
+ add another resource
via CSS Lint

JS

            
              $(function(){ 
    var targets = $(".header-container");
    if($(window).scrollTop() > 200){
    	// targets.hide();
   }
    $(window).scroll(function(){
        var pos = $(window).scrollTop();
        if(pos > 200){
            targets.fadeTo("fast", 1);
        } else {
            targets.fadeTo("fast", .5);
        }
    });
});

            
          
!
Must be a valid URL.
+ add another resource
via JS Hint
Loading ..................