Java ' C' handu: Rotate Text with no jquery Mozilla / IE

courtesy :w3schools

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<style type="text/css">
#rotateDiv
{
position:relative;
display:inline-block;
}
</style>

<script type="text/javascript">

function rotate(value)
{
document.getElementById('rotateDiv').style.top=document.getElementById('rotateDiv').offsetWidth/2 +'px'
document.getElementById('rotateDiv').style.webkitTransform="rotate(" + value + "deg)";
document.getElementById('rotateDiv').style.msTransform="rotate(" + value + "deg)";
document.getElementById('rotateDiv').style.MozTransform="rotate(" + value + "deg)";
document.getElementById('rotateDiv').style.OTransform="rotate(" + value + "deg)";
document.getElementById('rotateDiv').style.transform="rotate(" + value + "deg)";
}

if (document.addEventListener)
document.addEventListener("DOMContentLoaded", function(){alreadyrunflag=1; rotate(90)}, false)
else if (document.all && !window.opera){
document.write('<script type="text/javascript" id="contentloadtag" defer="defer" src="javascript:void(0)"><\/script>')
var contentloadtag=document.getElementById("contentloadtag")
contentloadtag.onreadystatechange=function(){
    if (this.readyState=="complete"){
      alreadyrunflag=1
      rotate(90)
    }
}
}

window.onload=function(){
setTimeout("if (!alreadyrunflag) rotate(90)", 0)
}

</script>

</head>
<body>
    <div id="rotateDiv">HELLO</div>
</body>

</html>

Thursday, April 26, 2012

Rotate Text with no jquery Mozilla / IE

No comments:

Post a Comment