title: How to show div when there is no scroll bar while using this existing code
body: <p>Here is my code</p>
  
  <pre><code>&lt;script src="http://code.jquery.com/jquery-latest.min.js"&gt;&lt;/script&gt;
  &lt;script&gt;
      $(document).ready(function() {
          $(window).scroll(function() {
      if ($(document).height() &lt;= ($(window).height() + $(window).scrollTop())) {
      //Bottom Reached
      $("#WebFooter").css("display","block");
         }else {
      $("#WebFooter").css("display","none");
              }
          });
      });
  &lt;/script&gt;
  &lt;style&gt;
      #WebFooter {
        position:fixed; bottom:0px; width:960; padding: 10px 0; background:#fff; border-top:1px solid #ccc; border-right:1px solid #ccc; border-left:1px solid #ccc; border-bottom:0px; box-shadow:0px 0px 3px 0px rgba(0,0,0,0.15); border-top-left-radius:3px; border-top-right-radius:3px; display: none;
      }
  
  
  &lt;/style&gt;
  
  &lt;div id="WebFooter"&gt;Footer Content&lt;/div&gt;
  </code></pre>
  
  <p>Would it be possible to show the div at the bottom when there is not enough page content to constitute showing a scroll bar? As of right now the div will only show up when the page is scrolled to the bottom. But if the page doesn't have enough content on the page to show a scroll bar, the div wont show up. You can see an example of what I am talking about if you go to <a href="http://anewdaychurch.org" rel="nofollow">http://anewdaychurch.org</a> </p>