/OpenSource

jQuery Sticky Footer


The jQuery sticky footer plugin sticks your footer, with or without set height, to the bottom of your page. You can also use the sticky footer plugin to stick other elements to the bottom of their parent. Check the demo for more information.

Example

HTML

<html>
    <body>
        <div id="page">
            <p>Content</p>
        </div>
        <div id="footer">
            <p>Footer</p>
        </div>
    </body>
</html>

CSS

.sticky-footer
{
    position: absolute;
    bottom: 0;
    width: 100%;
}

Javascript

$(window).load(function() {
    $("#footer").stickyFooter();
});

Options

$("#footer").stickyFooter({
    // The class that is added to the footer.
    class: 'sticky-footer',

    // The footer will stick to the bottom of the given frame. The parent of the footer is used when an empty string is given.
    frame: '',

    // The content of the frame. You can use multiple selectors. e.g. "#header, #body"
    content: '#page'
});

Statistieken

36 11 24 6

Laatst bijgewerkt

23 August 2018

Talen

Labels

,