asynchronous tweet button, image flickers

Question

Hello,

I am using the tweet button, with this asynchronous Javascript loading code below. When I place it at the bottom of my HTML the background image of the tweet button flickers, because it is loaded last.

I noticed in firebug it is pulling this via an iframe and the image is a background specified in CSS. Is there anyway to load the image locally to override the background image in the iframe?

var b = document.createElement('script');
b.type = 'text/javascript';
b.src = ('http://platform.twitter.com/widgets.js');
var a=document.getElementById("deferedjs");
a.parentNode.insertBefore(b,a);

Answer 1

iframe is in another domain so you can not touch it.

If the problem is with the image not being loaded, you can load the image on your page with an image preloader so it will be cached.

var img = new Image();
img.onload = img.onerror = function(){ alert('hello'); }
img.src = "http://example.com/imgs/someImage.png";