http://screencast.com/t/qDxr1p7bFp
Social buttons jump around until full load.
This movie clip shows the jumpy behavior of the social buttons as they load. This happens on Chrome, Firefox and IE, latest builds. Using Twitter bootstrap css via bootstrap-sass gem.
Is there anyway to hide them until they finish loading?
<div class="social-bar">
<div class="container">
<ul class="social-buttons">
<li class="fb-button">
<fb:like send="false" layout="button_count" width="450" show_faces="false"></fb:like>
</li>
<li class="tw-button">
<a href="https://twitter.com/share" class="twitter-share-button" data-via="adtechkyushu" data-hashtags="adtech9" data-dnt="true">Tweet</a>
</li>
</ul>
</div>
</div>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.1.1/js/bootstrap.min.js" type="text/javascript"></script>
<script src="http://connect.facebook.net/en_GB/all.js#xfbml=1"></script>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>