Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Не могу заставить! (https://javascript.ru/forum/dom-window/45192-ne-mogu-zastavit.html)

Виктор хаб 18.02.2014 15:36

Не могу заставить!
 
Только начал работать с 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>

рони 18.02.2014 15:56

Виктор хаб,
строка 16 даёшь массиву функцию!!!
строки 18 и 40 on в addEventListener
нет разделения что каждому блоку своё


Часовой пояс GMT +3, время: 19:32.