include/position.js

   1 function Browser() {
   2
   3   var ua, s, i;
   4
   5   this.isIE    = false;
   6   this.isNS    = false;
   7   this.version = null;
   8
   9   ua = navigator.userAgent;
  10
  11   s = "MSIE";
  12   if ((i = ua.indexOf(s)) >= 0) {
  13     this.isIE = true;
  14     this.version = parseFloat(ua.substr(i + s.length));
  15     return;
  16   }
  17
  18   s = "Netscape6/";
  19   if ((i = ua.indexOf(s)) >= 0) {
  20     this.isNS = true;
  21     this.version = parseFloat(ua.substr(i + s.length));
  22     return;
  23   }
  24
  25   // Treat any other "Gecko" browser as NS 6.1.
  26
  27   s = "Gecko";
  28   if ((i = ua.indexOf(s)) >= 0) {
  29     this.isNS = true;
  30     this.version = 6.1;
  31     return;
  32   }
  33 }
  34
  35 var browser = new Browser();
  36
  37 // Global object to hold drag information.
  38
  39 var dragObj = new Object();
  40 dragObj.zIndex = 0;
  41
  42 function dragStart(event, id) {
  43
  44   var el;
  45   var x, y;
  46
  47   // If an element id was given, find it. Otherwise use the element being
  48   // clicked on.
  49
  50   if (id)
  51     dragObj.elNode = document.getElementById(id);
  52   else {
  53     if (browser.isIE)
  54       dragObj.elNode = window.event.srcElement;
  55     if (browser.isNS)
  56       dragObj.elNode = event.target;
  57
  58     // If this is a text node, use its parent element.
  59
  60     if (dragObj.elNode.nodeType == 3)
  61       dragObj.elNode = dragObj.elNode.parentNode;
  62   }
  63
  64   // Get cursor position with respect to the page.
  65
  66   if (browser.isIE) {
  67     x = window.event.clientX + document.documentElement.scrollLeft
  68       + document.body.scrollLeft;
  69     y = window.event.clientY + document.documentElement.scrollTop
  70       + document.body.scrollTop;
  71   }
  72   if (browser.isNS) {
  73     x = event.clientX + window.scrollX;
  74     y = event.clientY + window.scrollY;
  75   }
  76
  77   // Save starting positions of cursor and element.
  78
  79   dragObj.cursorStartX = x;
  80   dragObj.cursorStartY = y;
  81   dragObj.elStartLeft  = parseInt(dragObj.elNode.style.left, 10);
  82   dragObj.elStartTop   = parseInt(dragObj.elNode.style.top,  10);
  83
  84   if (isNaN(dragObj.elStartLeft)) dragObj.elStartLeft = 0;
  85   if (isNaN(dragObj.elStartTop))  dragObj.elStartTop  = 0;
  86
  87   // Update element's z-index.
  88
  89   dragObj.elNode.style.zIndex = ++dragObj.zIndex;
  90
  91   // Capture mousemove and mouseup events on the page.
  92
  93   if (browser.isIE) {
  94     document.attachEvent("onmousemove", dragGo);
  95     document.attachEvent("onmouseup",   dragStop);
  96     window.event.cancelBubble = true;
  97     window.event.returnValue = false;
  98   }
  99   if (browser.isNS) {
 100     document.addEventListener("mousemove", dragGo,   true);
 101     document.addEventListener("mouseup",   dragStop, true);
 102     event.preventDefault();
 103   }
 104 }
 105
 106 function dragGo(event) {
 107
 108   var x, y;
 109
 110   // Get cursor position with respect to the page.
 111
 112   if (browser.isIE) {
 113     x = window.event.clientX + document.documentElement.scrollLeft
 114       + document.body.scrollLeft;
 115     y = window.event.clientY + document.documentElement.scrollTop
 116       + document.body.scrollTop;
 117   }
 118   if (browser.isNS) {
 119     x = event.clientX + window.scrollX;
 120     y = event.clientY + window.scrollY;
 121   }
 122
 123   // Move drag element by the same amount the cursor has moved.
 124
 125   dragObj.elNode.style.left = (dragObj.elStartLeft + x - dragObj.cursorStartX) + "px";
 126   dragObj.elNode.style.top  = (dragObj.elStartTop  + y - dragObj.cursorStartY) + "px";
 127
 128   if (browser.isIE) {
 129     window.event.cancelBubble = true;
 130     window.event.returnValue = false;
 131   }
 132   if (browser.isNS)
 133     event.preventDefault();
 134 }
 135
 136 function dragStop(event) {
 137
 138   // Stop capturing mousemove and mouseup events.
 139
 140   if (browser.isIE) {
 141     document.detachEvent("onmousemove", dragGo);
 142     document.detachEvent("onmouseup",   dragStop);
 143   }
 144   if (browser.isNS) {
 145     document.removeEventListener("mousemove", dragGo,   true);
 146     document.removeEventListener("mouseup",   dragStop, true);
 147   }
 148   //alert(document.getElementById('boxA').style.top + "\n" + document.getElementById('boxA').style.left );
 149
 150 }