title: How to make images fade visible when i'm scrolling
body: <pre><code>    &lt;div id="smiley"&gt;
          &lt;div id="star"&gt;
              &lt;img src="inc/img/heks.png" class="star"&gt;
              &lt;img src="inc/img/impo.png" class="star"&gt;
              &lt;img src="inc/img/angst.png" class="star"&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  
      #smiley{
          margin: 50px auto 80px;
          width: 1132px;
          height: 300px;
      }
  
      #smiley #star{
          display: none;
          float: left;
          height: 300px;
          width: 1132px;
      }
  
  #smiley #star img.star{
      display: block;
      float: left;
      width: 300px;
      margin: 50px 38px 0px;
  }
  </code></pre>
  
  <p>I need have the images to fade visible when i'm scrolling down to them.</p>
  
  <p>i hope you understand the question.</p>
  
  <ul>
  <li>This website template, does it <a href="http://www.templatemonster.com/demo/51771.html" rel="noreferrer">http://www.templatemonster.com/demo/51771.html</a></li>
  </ul>