Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 19.07.2013, 17:25
JSN JSN вне форума
Аспирант
Отправить личное сообщение для JSN Посмотреть профиль Найти все сообщения от JSN
 
Регистрация: 01.09.2012
Сообщений: 57

Drag&Drop или не Drag&Drop
У меня вопрос. Я пытаюсь самостоятельно учить JavaScript + CSS + HTML. Решил попробовать использовать drag and drop. То, что было написано в статье я понял, логику понял, но все это работает только с lib.js, содержимое которого я до конца понять не смог (http://learn.javascript.ru/play/tuto...ple/index.html). Но я попробовал сделать сам и вот что вышло. Это вероятно говнокод, но ввиду того, что я нуб, понять почему именно не могу:
Код:
<!DOCTYPE HTML>
<html>
  
  <head></head>
  
  <body>
    <div class='drag' onmouseover = 'drag(this)'></div>
	<div class='drag' onmouseover = 'drag(this)'></div>
	<div class='drag' onmouseover = 'drag(this)'></div>
	<div class='drag' onmouseover = 'drag(this)'></div>
	<div class='drag' onmouseover = 'drag(this)'></div>
    <style>
      .drag {
        cursor:move;
        width:100px;
        height:100px;
        background:red;
        position:absolute;
		}
    </style>
    <script>
      var int, top1, left, y, x, i = 0;
    function drag(drag) {
	  drag.onmousedown = function (e) {
        drag.innerHTML = 'objattached'
        y = e.pageY - drag.offsetTop;
        x = e.pageX - drag.offsetLeft;
        window.onmousemove = function (e) {
          drag.innerHTML = 'FATAL';
          top1 = e.pageY - y;
          left = e.pageX - x;
          drag.style.top = top1 + 'px';
          drag.style.left = left + 'px';
          drag.innerHTML = 'objattached'
        }
      }
      drag.onmouseup = function (e) {
        drag.innerHTML = 'objdisattached';
        window.onmousemove = function () {
          drag.innerHTML = 'FATAL';
          drag.style.top1 = top1 + 'px';
          drag.style.left = left + 'px';
          drag.innerHTML = 'objdisattached';
        }
      }
	}
	function preventSelection(element){
  var preventSelection = false;

  function addHandler(element, event, handler){
    if (element.attachEvent) 
      element.attachEvent('on' + event, handler);
    else 
      if (element.addEventListener) 
        element.addEventListener(event, handler, false);
  }
  function removeSelection(){
    if (window.getSelection) { window.getSelection().removeAllRanges(); }
    else if (document.selection && document.selection.clear)
      document.selection.clear();
  }
  function killCtrlA(event){
    var event = event || window.event;
    var sender = event.target || event.srcElement;

    if (sender.tagName.match(/INPUT|TEXTAREA/i))
      return;

    var key = event.keyCode || event.which;
    if (event.ctrlKey && key == 'A'.charCodeAt(0))
    {
      removeSelection();

      if (event.preventDefault) 
        event.preventDefault();
      else
        event.returnValue = false;
    }
  }
  addHandler(element, 'mousemove', function(){
    if(preventSelection)
      removeSelection();
  });
  addHandler(element, 'mousedown', function(event){
    var event = event || window.event;
    var sender = event.target || event.srcElement;
    preventSelection = !sender.tagName.match(/INPUT|TEXTAREA/i);
  });
  addHandler(element, 'mouseup', function(){
    if (preventSelection)
      removeSelection();
    preventSelection = false;
  });
  addHandler(element, 'keydown', killCtrlA);
  addHandler(element, 'keyup', killCtrlA);
}
preventSelection(document);
    </script>
  </body>

</html>
Заранее благодарю.
P.S. Если вы поясните что находится в fixEvent(), буду весьма признателен

Последний раз редактировалось JSN, 20.07.2013 в 13:41.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Обработчик click вызывается несколько раз или не всегда вызывается OlegJquery jQuery 2 21.07.2011 20:37
Найти проблему с jQuery или писать js? Saladdin Элементы интерфейса 0 17.03.2011 17:02
В зависимости от referrer выводить рекламу adsene или зорьки wlad2 Общие вопросы Javascript 12 19.12.2010 01:02
Алгоритм плавной смены фона или изображения vandy3 Общие вопросы Javascript 6 11.11.2010 00:56
Как узнать свернуто окно браузера или нет. bar-boss Events/DOM/Window 3 25.09.2008 16:09