<div id="sharebox-wrapper">
    <div id="sharebox" class="absolute">
        <div class="inner">
            <!-- Twitter -->
            <div class="panel twitter" title="Tweet this article">
                <script src="http://platform.twitter.com/widgets.js" type="text/javascript"></script>
                <a href="http://twitter.com/share" class="twitter-share-button" data-url="http://demos.brianmcculloh.com/swagger/full-width-page/" data-via="outerspice" data-text="Full-Width Page" data-count="vertical">Tweet</a>
            </div>
            <!-- Facebook -->
            <div class="panel" title="Like on Facebook">
                <iframe src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fdemos.brianmcculloh.com%2Fswagger%2Ffull-width-page%2F&amp;layout=box_count&amp;show_faces=true&amp;width=50&amp;action=like&amp;font=arial&amp;colorscheme=light&amp;height=65" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:50px; height:65px;" allowTransparency="true"></iframe>
            </div>
            <!-- Google Buzz -->
            <div class="panel" title="Google +1">
                <g:plusone size="tall"></g:plusone>
            </div>
            <!-- Pinterest -->
            <div class="panel" title="Pinterest">
                <a href="http://pinterest.com/pin/create/button/?url=http://demos.brianmcculloh.com/swagger/full-width-page/&amp;media=http%3A%2F%2Fdemos.brianmcculloh.com%2Fswagger%2Ffiles%2F2011%2F11%2F1104white_iphone4-160x160.jpg" class="pin-it-button" count-layout="vertical">Pin It</a>
            </div>
            <!-- Digg -->
            <div class="panel" title="Digg this article">
                <a class="DiggThisButton DiggMedium" href="http://digg.com/submit?url=http://demos.brianmcculloh.com/swagger/full-width-page/&amp;title=Full-Width Page&amp;bodytext=&lt;p&gt;Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed lacinia magna dolor, eu volutpat nisi. Maecenas sit amet sem urna, a pharetra mauris. Integer justo tellus, tristique non viverra convallis, ullamcorper id massa. Pellentesque porttitor varius magna consectetur tempor. Duis eu nisl vitae libero pellentesque lacinia in eu massa. Integer commodo, purus a venenatis convallis, [...]&lt;/p&gt;
"></a>
                <script src="http://widgets.digg.com/buttons.js" type="text/javascript"></script>
            </div>
            <!-- StumbleUpon -->
            <div class="panel" title="Submit to StumbleUpon">
                <script src="http://www.stumbleupon.com/hostedbadge.php?s=5"></script>
            </div>
            <!-- Tumblr -->
            <div class="panel" title="Share on Tumblr">
                <a href="http://www.tumblr.com/share" title="Share on Tumblr" style="display:inline-block; text-indent:-9999px; overflow:hidden; width:61px; height:20px; background:url('http://platform.tumblr.com/v1/share_2.png') top left no-repeat transparent;">Share on Tumblr</a>
            </div>
            <!-- Email -->
            <div class="panel" title="Email to a friend">
                <a href="mailto:type%20email%20address%20here?subject=I%20wanted%20to%20share%20this%20post%20with%20you%20from%20Swagger&amp;body=Full-Width Page - http://demos.brianmcculloh.com/swagger/full-width-page/" target="_blank" class="share-email">&nbsp;</a>
            </div>
        </div>
    </div>
</div>
<script type="text/javascript">
    /*sharebox scrolling*/
    var mediaTop = jQuery('div#sharebox').offset().top; 
    var media = jQuery('div#sharebox');
    
    jQuery(document).scroll( function() {
       var scrollTop = jQuery(document).scrollTop();
    
       //fix/unfix as necessary
       if (mediaTop < scrollTop) {
           jQuery(media).addClass('fixed'); 
       }
       else { 
           jQuery(media).removeClass('fixed'); 
       }
    });
</script>