Только начал работать с javaScript, и сразу обрел проблему!( Помогите, подскажите!)
Не могу заставить перемещаться несколько DIV, а один так на ура, перерыл весь интернет проблему так и не решил!
Вот мой косячный код!)
<div class="block" style=" cursor: move; position: absolute; background: #F2F2F2; width:350px; height: 50px; border-radius:10px; padding:10px;">Block1</div>
<div class="block" style=" cursor: move; position: absolute; left:380px; background: #F2F2F2; width:350px; height: 50px; border-radius:10px; padding:10px;">Block2</div>
<script type='text/javascript'>
var ie = 0;
var op = 0;
var ff = 0;
var browser = navigator.userAgent;
if (browser.indexOf("Opera") != -1) op = 1;
else {
if (browser.indexOf("MSIE") != -1) ie = 1;
else {
if (browser.indexOf("Firefox") != -1) ff = 1;
}
}
var block = document.querySelectorAll(".block");
delta_x = 0;
delta_y = 0;
block.onmousedown = saveXY;
for(var i = 0; i < block.length; i++){
block[i].addEventListener("onmousedown", saveXY, false);
}
document.onmouseup = clearXY;
function saveXY(obj_event) {
if (obj_event) {
x = obj_event.pageX;
y = obj_event.pageY;
}
else {
x = window.event.clientX;
y = window.event.clientY;
if (ie) {
y -= 2;
x -= 2;
}
}
x_block = block.offsetLeft;
y_block = block.offsetTop;
delta_x = x_block - x;
delta_y = y_block - y;
document.onmousemove = moveBlock;
if (op || ff)
document.addEventListener("onmousemove", moveBlock, false);
}
function clearXY() {
document.onmousemove = null;
}
function moveBlock(obj_event) {
if (obj_event) {
x = obj_event.pageX;
y = obj_event.pageY;
}
else {
x = window.event.clientX;
y = window.event.clientY;
if (ie) {
y -= 2;
x -= 2;
}
}
new_x = delta_x + x;
new_y = delta_y + y;
block.style.top = new_y + "px";
block.style.left = new_x + "px";
}
</script>
