JQuery Toggle Footer

http://www.dte.web.id/2012/07/toggle-sidebar-dengan-jquery.html?showComment=1374187284363#c8822424117740333278

by Taufik Nurrohman

HTML

<a href="#" class="toggle-footer-btn">+</a>
<div style="clear:both;"></div>
<div id="footer" class="footer">
    Konten...
</div>

CSS

body {padding:50px 10px 10px}

.toggle-footer-btn {
    background-color:black;
    display:block;
    float:right;
    font:normal normal 20px/40px Arial,Sans-Serif;
    color:white;
    text-decoration:none;
    width:40px;
    height:40px;
    text-align:center;
}

.toggle-footer-btn {text-decoration:none}

.footer {
    background-color:black;
    color:white;
    padding:10px;
    height:150px;
    display:none;
    clear:both;
}

JavaScript

$(document).ready(function() {
    $('.toggle-footer-btn').click(function() {
        $(this).html($(this).html() == '+' ? '-' : '+');
        $('#footer').slideToggle(400);
        return false;
    });
});