Search code examples
jquerycssfixed

Have footer fixed when less content on clicks within page

How could I have footer fixed to always bottom when less content on all screens when on click content changed and have it fixed to bottom ONLY when content is less with CSS or Jquery

Solution

  • Can you try the following

    <html>
 <body>
  <div id="wrap">
     MY Content
  </div>
 <footer class="footer" id="appfooter">
   <div>
    MY Footer
   </div>
 </footer>
 </body>
</html>

    css class(You can also add more properties according to the requirement)

     .footer {
    clear: both;
    text-align: center;
  }

    In document ready 

    var footerheight = $('.footer').innerHeight();
var browserheight = $(window).height() - footerheight ; //footerheight
$("#wrap").css("min-height", browserheight);