This is a wonderful script. Exactly what I have been looking for. It's only drawback is the ugly jumping when the text is replaced by the image. This is especially noticable when you use a non-standard font, that the user doesn't have.
After much fiddling, with visibility and delays, I solved it like this:
text2png.onLoad = function(){
if(document.getElementById('sidrubrik'))
{
//The element "sidrubrik" is empty to begin with, so for starters I fill it with something.
document.getElementById('sidrubrik').innerHTML=document.title;
text2png.replace('sidrubrik',{
'shadow_color':'#999999', // the shadow color defaults to black
'shadow_distance':10, // the distance in the shadow (set to zero to remove the shadow
'shadow_blur':8, // where the shadow start fading
'shadow_strength':12, // the opacity of the shadow
'shadow_angle':330 // the angle of the shadow (no comma after the last option)
});
//To make the text invisible, set the color to same as background and the size to 0
document.getElementById('sidrubrik').style.color='#F5E9F0';
document.getElementById('sidrubrik').style.fontSize=0;
}
}
I have used it for the headlines on this site:
http://www.norradalskulturforening.se
