title: How to create HTML+jScript Scroll Triggered Box
body: <p>I have a blog at Blogger.com and I want to add a Scroll Triggered Box like Dreamgrow or Qoate Scroll Triggered Box of Wordpress. I referred <a href="http://dannyvankooten.com/189/scroll-triggered-box-with-jquery/" rel="nofollow">Scroll Triggered Box with jQuery</a>. I have created a HTML file and testing it but this is not working for me. May be I have mistaken somewhere. My coding is </p>
  
  <pre><code>&lt;html&gt;
  
  &lt;head&gt;
  
  &lt;title&gt;Scroll Triggered Box With jQuery&lt;/title&gt;
  
  &lt;style type="text/css"&gt;
  .Comments
  {
  font:georgia;
  display:none;
  }
  
  
  &lt;/style&gt;
  
  &lt;/head&gt;
  
  &lt;body&gt;
  
  &lt;script type="text/javascript"&gt;
      $(document).ready(function () {
          $(window).scroll(function () {
              var y = $(window).scrollTop();
              var c = $('#comments').offset();
              if (y &gt; (c.top - $(window).height())) {
                  $('#the_box').fadeIn("slow");
              } else {
                  $('#the_box').fadeOut('slow');
              }
          });
      });
  &lt;/script&gt;
  
  &lt;div&gt;
  &lt;!--My long post here--&gt;
  &lt;/div&gt;
  
  &lt;div class="Comments" id="the_box"&gt;
  This is the DIV that triggers I scroll down to Comments&lt;/br&gt;
  This is the DIV that triggers I scroll down to Comments&lt;/br&gt;
  This is the DIV that triggers I scroll down to Comments&lt;/br&gt;
  This is the DIV that triggers I scroll down to Comments&lt;/br&gt;
  This is the DIV that triggers I scroll down to Comments&lt;/br&gt;
  This is the DIV that triggers I scroll down to Comments
  &lt;/div&gt;
  
  &lt;/body&gt;
  
  &lt;/html&gt;
  </code></pre>
  
  <p>I am little weak in jScript. I don't know how jScript works. </p>
  
  <p><strong>How can I resolve my issue and get this working in my Blogger.com blog?</strong></p>