Results 1 to 2 of 2

Thread: Dragging and dropping

  1. #1
    Join Date
    Nov 2005
    Thanked 0 Times in 0 Posts

    Default Dragging and dropping

    Please can someone help?

    What I am trying to do is to get an image that is called by one script
    to be actionable by another. The images are initialized in one <div>
    and the trash function is another <div> How can I get the intialized
    images draggable into the trash? I need to fix this for a client, so
    any help would be great.

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    <html xmlns="" xml:lang="en" lang="en">
    <meta http-equiv="expires" content="0">
    <meta http-equiv="content-type" content="text/html;
    <META HTTP-EQUIV="imagetoolbar" CONTENT="no">
    <title> Test layout</title>
    <link href="css/autolay.css" rel="stylesheet" type="text/css">
    <script type="text/javascript" src="scripts/prototype.js"></script>
    <script type="text/javascript" src="scripts/effects.js"></script>
    <script type="text/javascript" src="scripts/dragdrop.js"></script>
    <script type="text/javascript" src="scripts/wz_dragdrop.js"></script>

    <body bgcolor="#ffffff">

    <table cellpadding="6">

    <div id="comment" style="position:relative;">
    <b>Drag the image with your mouse to move it around the screen.</b>
    <div id="image1" style="position:absolute; left:10; top:60;">
    <img name="image1" src="images/image1.jpg" width="279" height="225"
    alt="" title="Image 1">
    <div id="panel2" style="position:absolute; left:30; top:80;">
    <img name="image2" src="images/image2.jpg" width="279" height="225"
    alt="" title="Image 2">
    <script type="text/javascript">
    SET_DHTML(CURSOR_MOVE, RESIZABLE, "image1", "image2",

    for (var i = 0; i < dd.elements.length; i++)

    // images should not be visible initially


    <div id="content">
    <div id="cart" class="cart">
    <div id="items">


    <img alt="panel1" class="cart-items" id="item_1_0"
    src="images/image1.jpg" width="279" height="144"
    style="position:relative;" />
    <script type="text/javascript">new Draggable('item_1_0',


    <div style="clear:both;"></div>
    <div id="wastebin">
    Drop a panel here to remove it.

    <div style="height:40px;padding-top:10px;">
    <p id="indicator" style="display:none;margin-top:0px;">
    <img alt="Indicator" src="indicator.gif" /> Updating Autolayout...

    <script type="text/javascript">
    Droppables.add('wastebin', {accept:'cart-items',
    onDrop:function(element){Element.hide(element); new
    Ajax.Updater('items', '/shop/remove',
    parameters:'id=' + encodeURIComponent(, evalScripts:true,
    asynchronous:true})}, hoverclass:'wastebin-active'})</script>


  2. #2
    Join Date
    Apr 2006
    Thanked 0 Times in 0 Posts


    like this and this?
    Please don't mind me. I am just posting a lot of nonsense.


Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts