Modify Drag script

Discussion in 'Javascript' started by DanWeaver, Feb 12, 2007.

  1. DanWeaver

    DanWeaver Guest

    I am trying to modify the below script which allows elements of
    class="drag" to be dragged around the screen by a user- am new to
    javascript and learning this along with vbscript (which I understand
    better), ajax and HTML. I need to get (either as a hidden text box or
    a variable to be used in other functions (including vbscript
    functions) the coordinates of a dragged object after the drag
    operation ie to know exactly where each draggable element is at all
    times.
    Any help massively appreciated. Dan.

    <style type="text/css">
    .drag{
    position:relative;
    cursor:hand;
    z-index: 100;
    }
    </style>
    <script type="text/javascript">
    /***********************************************
    * Drag and Drop Script: © Dynamic Drive (http://
    www.dynamicdrive.com)
    * This notice MUST stay intact for legal use
    * Visit http://www.dynamicdrive.com/ for this script and 100s
    more.
    ***********************************************/
    var dragobject={
    z: 0, x: 0, y: 0, offsetx : null, offsety : null, targetobj :
    null, dragapproved : 0,
    initialize:function(){
    document.onmousedown=this.drag
    document.onmouseup=function(){this.dragapproved=0}
    },
    drag:function(e){
    var evtobj=window.event? window.event : e
    this.targetobj=window.event? event.srcElement : e.target
    if (this.targetobj.className=="drag"){
    this.dragapproved=1
    if (isNaN(parseInt(this.targetobj.style.left)))
    {this.targetobj.style.left=0}
    if (isNaN(parseInt(this.targetobj.style.top)))
    {this.targetobj.style.top=0}
    this.offsetx=parseInt(this.targetobj.style.left)
    this.offsety=parseInt(this.targetobj.style.top)
    this.x=evtobj.clientX
    this.y=evtobj.clientY

    if (evtobj.preventDefault)
    evtobj.preventDefault()
    document.onmousemove=dragobject.moveit
    }
    },
    moveit:function(e){
    var evtobj=window.event? window.event : e
    if (this.dragapproved==1){
    this.targetobj.style.left=this.offsetx+evtobj.clientX-this.x
    +"px"
    this.targetobj.style.top=this.offsety+evtobj.clientY-this.y
    +"px"
    return false
    }
    }
    }

    dragobject.initialize()
    </script>
    DanWeaver, Feb 12, 2007
    #1
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Benjamin Rutt
    Replies:
    2
    Views:
    934
    Peter Hansen
    Dec 20, 2005
  2. est
    Replies:
    3
    Views:
    279
  3. Kt Br

    modify output of script

    Kt Br, May 13, 2008, in forum: Ruby
    Replies:
    2
    Views:
    112
    Robert Klemme
    May 13, 2008
  4. VK

    A compatible drag-n'-drop script

    VK, Jun 1, 2005, in forum: Javascript
    Replies:
    1
    Views:
    78
    lorinho
    Jun 2, 2005
  5. tlyczko
    Replies:
    11
    Views:
    250
    tlyczko
    Nov 28, 2005
Loading...

Share This Page