slow fade button

by Nick Hulea

HTML

<button data-clearqueue="1" data-jumptoend="0">stop(1,0)</button><br />
<button data-clearqueue="1" data-jumptoend="1">stop(1,1)</button>
<div id="b"></div>

CSS

#b {
    height: 100px;
    width: 100px;
    margin-top: 20px;
    background-color: #00f;
}

JavaScript

var launchAnim = function(clearQueue, jumpToEnd) {
    $('#b').stop(clearQueue, jumpToEnd).fadeOut(500);
    
    window.setTimeout(function() {
        $('#b').stop(clearQueue, jumpToEnd).fadeIn(500);
    }, 300);
};

$('button').click(function() {
    launchAnim($(this).data('clearqueue'), $(this).data('jumptoend'));
});