Здравствуйте.
Есть скрипт, который позволяет с помощью мыши перемещать DIVы по странице, а так же выбирать из них активный (поверх остальных). Такое решение стало необходимым для размещения на странице нескольких видеотрансляций.
Прошу помочь в доработке данного скрипта, чтобы DIVы можно было ещё и растягивать мышью по ширине и длине.
Скрипт:
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 dragOBJ(d,e) {
var divs=document.getElementsByTagName("DIV");
for( var i=0; i<divs.length; i++)
if(divs[i].className=="my")
divs[i].style.zIndex = 0;
function drag(e) { if(!stop) { d.style.zIndex = 1; d.style.top=(tX=xy(e,1)+oY-eY+'px'); d.style.left=(tY=xy(e)+oX-eX+'px'); } }
var oX=parseInt(d.style.left),oY=parseInt(d.style.top),eX=xy(e),eY=xy(e,1),tX,tY,stop;
document.onmousemove=drag; document.onmouseup=function(){ stop=1; document.onmousemove=''; document.onmouseup=''; };
}
<div class="my" style="width:640px; position: relative; top: 0; left: 0" onmousedown="dragOBJ(this,event);">Первый ДИВ</div>
<div class="my" style="width:640px; position: relative; top: 0; left: 0" onmousedown="dragOBJ(this,event);">Второй ДИВ</div>
Спасибо.