Сообщение от melky
|
PS. что-то я вспомнил про expressions... хм, может, еще получится сделать нормальный поворот, не имея на руках элемент.
|
expression конечно хорошо, но вот проблема в том что ИЕ8 не поддерживает expression, тут и попа вся.. а так для эмуляции rotate в IE7 и ниже я пользовался таким хаком:
Работает во всех браузерах кроме
ИЕ8
<style type="text/css">
#to_rotate {
position: absolute;
width: 100px;
height: 100px;
background-color: #f00;
filter:expression("progid:DXImageTransform.Microsoft.Matrix(sizingMethod='auto expand',M11="+(this.style.Rotate?1:(this.style.Rotate=0),(this.xWidth?1:(this.xWidth=this.offsetWidth,this.xHeight=this.offsetHeight,1)),(this.style.marginLeft=(-Math.round((this.offsetWidth-this.xWidth)/2))+"px"),(this.style.marginTop=(-Math.round((this.offsetHeight-this.xHeight)/2))+"px"),Math.cos((this.style.Rotate*Math.PI)/180.0))+",M12="+(-(Math.sin((this.style.Rotate*Math.PI)/180.0)))+",M21="+(Math.sin((this.style.Rotate*Math.PI)/180.0))+",M22="+(Math.cos((this.style.Rotate*Math.PI)/180.0))+")");
}
</style>
<div style="position: relative;">
<div id="to_rotate">test text</div>
</div>
<script type="text/javascript">
setInterval(function() {
var el = document.getElementById('to_rotate');
// специальное свойство для IE ниже восьмой версии
el.style.Rotate = (el.style.Rotate||0) + 2;
// для все остальных
el.style.OTransform =
el.style.MozTransform =
el.style.WebkitTransform =
el.style.msTransform =
el.style.transform = "rotate(" + el.style.Rotate + "deg)";
}, 50);
</script>