Есть div, в нем размещен img. По нажатию мышкой на div скрипт начинает отслеживать перемещения курсора по окну и изменять размеры div'a и img'а. В FF и Опере все замечательно работает, а IE - тупит: позволяет скрипту отработать несколько пикселов, а потом сбоит.
Если картинку убрать или сделать меньше дива, то IE тупит только если щелчок мышкой был по изображению, а если по div'y, то его он масштабирует корректно. Такое впечатление, что IE после небольшого смещения мыши после нажатия на картинку начинает "тащить" эту картинку (показывает перечеркнутый круг), что сбивает скрипт. Помогите разобраться с этой неприятностью
CODE ( html):
скопировать код в буфер обмена
<html> <head> <title></title> </head> <body> <script type="text/javascript"> function $(v) { return(document.getElementById(v));} function agent(v) { return(Math.max(navigator.userAgent.toLowerCase().indexOf(v),0));} function xy(e,v) { return(v?(agent("msie")?event.clientY+document.body.scrollTop:e.pageY):(agent("msie")?event.clientX+document.body.scrollTop:e.pageX));} function spanOBJ(d,e) { function span(e) {if(!stopspan) {d.style.width=(dX=(xy(e)+hX-eX+"px")); d.style.height=(dY=((xy(e)+hX-eX)*koef+"px")); d.firstChild.style.height=dY; d.firstChild.style.width=dX;} } var hY=parseInt(d.style.height),hX=parseInt(d.style.width), koef=hY/hX, eX=xy(e),dX, dY, stopspan; document.onmousemove=span; document.onmouseup=function() { stopspan=1; document.onmousemove=""; document.onmouseup=""; }; } </script> <div style="background: #ee9999; height: 120px; width: 178px; position: absolute;" onmousedown="spanOBJ(this,event); return false;"><img src="http://img.yandex.net/i/www/logo.png" style="height: 120px; width: 178px;"></div> </body> </html>
(Добавление)
Проблема решена!
Необходимо запретить браузеру реагировать на перетаскивание элемента, для этого, используем обработчик события: ondragstart="return false";
|