Jquery sticky footer that adjusts with dynamic content

I'm currently using the plugin here http://codedumper.com/jquerystickyfooter to create a sticker footer.

Take a look http://client.astam.co.uk. It works as you would expect.

The only problem is that, for example, if an error message comes up and the user clicks to remove, or toggled content is available the footer will jump up from the bottom of the browser until the window is resized and then it will 开发者_如何转开发sort itself out.

Is there a way for the plugin to know to re-position itself?

Better use $.stickyFooterPos() as a callback for other layout changing functions like changing the close function in your app.js to

    function close(){
    $(this).attr('href', 'javascript:void(0)');
    $(this).parent().fadeOut(200,function(){$.stickyFooterPos()});
}

P.S: as others suggested, position:fixed is a far more better choice considering the fact that the number of IE6 users are declining... (see http://www.w3schools.com/browsers/browsers_explorer.asp and also http://www.w3schools.com/browsers/browsers_stats.asp )

Are you supporting IE6? If not, then you can simply position the footer as "position: fixed" instead of using the jQuery plugin. Apart from that the JQ plugin positions the div only on window load, resize and scroll. The following code added for the alert close button will work -

    $('#alert .close').click(
       function() {
         $.stickyFooterPos();
        }
   );

Just add that to your js file and the positioning will work when the close button is clicked.

EDIT - The previous code may not work if you are using fadeOut() for the close button. Rather you can change the code for the close button to -

$(this).attr('href', 'javascript:void(0)');
$(this).parent().fadeOut(200, function(){$.stickyFooterPos()});
$.stickyFooterPos();