In our previous article Add Facebook Like Button To Website, we explained the reason for using this technique.
"One notorious problem of adding social buttons, such as the Facebook Like button, to a website is that they can significantly slow down loading your web page. Though by using asynchronous load technique this problem has been solved somewhat, the page load time and responsiveness is still a big issue, especially when there are multiple social network buttons on a page...."
Get Your g+1 Button
If you have not done so, following this link to get your own Google +1 button. The source code for Voicent's +1 button is shown below:
<g:plusone size="medium" annotation="inline" href="..."></g:plusone>
When you put this code in your web page, it will show a Google Plus One button with the counter on the right.
Delay Load the g+1 Button
Though the Google +1 button has asynchronous support, it is still interfere with the responsiveness of the page. We go a step further by delaying the load until a mouse is moved over the button.
In the place of the g:plusone tag, replace it with a simple img tag with onMouseOver defined as follows:
<img sec="/images/gplus-button.png" onMouseOver="renderPlusone();">