There is a javascript library called "Raphael" located here:
Raphaël?JavaScript Library
With this library you can manipulate text and images in any way imaginable.
Here is a simple example that rotates some text 90 degrees on mouseover and back again on mouseout.
HTML Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<script src="raphael.js" type="text/javascript" charset="utf-8"></script>
<script>
var rot=0;
var degrees=90;
var speed=3;
var interval=10;
var txt,R,cw,ccw;
function initObj()
{
var container = document.getElementById("holder");
var text = container.getElementsByTagName("span")[0];
var attr1 = {font: '24px Fontin-Sans, Arial', opacity: 1};
R = Raphael("holder", 225, 225);
txt = R.text(110, 110, text.innerHTML).attr(attr1).attr({fill: "#00f"});
text.style.visibility = "hidden";
}
function rotateClockwise()
{
if(ccw){clearTimeout(ccw);}
if(rot<degrees)
{
rot+=speed;
txt.rotate(rot, true);
R.safari();
cw = setTimeout("rotateClockwise()",interval);
}
}
function rotateCounterClockwise()
{
if(cw){clearTimeout(cw);}
if(rot>0)
{
rot-=speed;
txt.rotate(rot, true);
R.safari();
ccw = setTimeout("rotateCounterClockwise()",interval);
}
}
</script>
</head>
<body onload="initObj()">
<div id="holder" onmouseover="cw = setTimeout('rotateClockwise()',interval);" onmouseout="ccw = setTimeout('rotateCounterClockwise()',interval);">
<span>Mouseover to rotate</span>
</div>
</body>
</html>