// Window load event used just in case window height is dependant upon images
$(window).bind("load resize", function() { 
       
       var footerHeight = 0,
           footerTop = 0,
           $footer = $("#footer");
           
       positionFooter();
       
       function positionFooter() {
                footerHeight = $footer.height();
                footerTop = ($(window).scrollTop()+$(window).height()-footerHeight);
                footerTopPX = footerTop + "px";
                containerH = $("#container").height(); 
                big = containerH > footerTop ? containerH : footerTop;

/* console.log("Document height: ", $(document.body).height());
                console.log("Window height: ", $(window).height());
                console.log("Window scroll: ", $(window).scrollTop());
                console.log("Footer height: ", footerHeight);
                console.log("Footer top: ", footerTop);
                console.log("container hi top: ", $("#container").height());
                console.log("footerheight: ", $("#footer").height());
                console.log("Big: ", big);
                console.log("-----------");
*/
 
                if ($(document.body).height() < $(window).height() && ($("#container").height() - $("#footer").height()) < footerTop ) {
                    $footer.css("top", big +"px");
                    $footer.css("position", "absolute");
                }
                $footer.css("display", "block");    
       }

       $(window)
               .scroll(positionFooter)
               .resize(positionFooter)

});