Results 1 to 4 of 4

Thread: Drag and drop problem

  1. #1
    Join Date
    Jan 2008
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Drag and drop problem

    The drag and drop script I'm using works fine on my computer but online in the web page the images don't appear. Can anyone tell me why not? Here is the script and my web site. Thanks for constructive advice.

    http://eslcomics.100webspace.net/Com...leImages4.html

    <html>
    <head>
    <title>Untitled</title>
    <style>
    <!--
    .dragme{position:relative;}
    -->
    </style>
    <script language="JavaScript1.2">
    <!--

    var ie=document.all;
    var nn6=document.getElementById&&!document.all;

    var isdrag=false;
    var x,y;
    var dobj;

    function movemouse(e)
    {
    if (isdrag)
    {
    dobj.style.left = nn6 ? tx + e.clientX - x : tx + event.clientX - x;
    dobj.style.top = nn6 ? ty + e.clientY - y : ty + event.clientY - y;
    return false;
    }
    }

    function selectmouse(e)
    {
    var fobj = nn6 ? e.target : event.srcElement;
    var topelement = nn6 ? "HTML" : "BODY";

    while (fobj.tagName != topelement && fobj.className != "dragme")
    {
    fobj = nn6 ? fobj.parentNode : fobj.parentElement;
    }

    if (fobj.className=="dragme")
    {
    isdrag = true;
    dobj = fobj;
    tx = parseInt(dobj.style.left+0);
    ty = parseInt(dobj.style.top+0);
    x = nn6 ? e.clientX : event.clientX;
    y = nn6 ? e.clientY : event.clientY;
    document.onmousemove=movemouse;
    return false;
    }
    }
    document.onmousedown=selectmouse;
    document.onmouseup=new Function("isdrag=false");
    //-->
    </script>
    </head>
    <body>
    <img name="P1" src="P1.jpg" class="dragme" width="150" height="100" border="0" alt="P1">
    <img name="P2" src="P2.jpg" class="dragme" width="150" height="100" border="0" alt="P2">
    <img name="P3" src="P3.jpg" class="dragme" width="150" height="100" border="0" alt="P3">
    <img name="P4" src="P4.jpg" class="dragme" width="150" height="100" border="0" alt="P4">
    <img name="P5" src="P5.jpg" class="dragme" width="150" height="100" border="0" alt="P5">
    </body>
    </html>

  2. #2
    Join Date
    Sep 2005
    Location
    India
    Posts
    1,627
    Thanks
    6
    Thanked 107 Times in 107 Posts

    Default

    I have made some changes in the following section a bit in your code, the change i've made is in bold state.


    <img name="P1" src="P1.JPG" class="dragme" width="150" height="100" border="0" alt="P1">
    <img name="P2" src="P2.JPG" class="dragme" width="150" height="100" border="0" alt="P2">
    <img name="P3" src="P3.JPG" class="dragme" width="150" height="100" border="0" alt="P3">
    <img name="P4" src="P4.JPG" class="dragme" width="150" height="100" border="0" alt="P4">
    <img name="P5" src="P5.JPG" class="dragme" width="150" height="100" border="0" alt="P5">


    Actually you've used the image like "P1.jpg" in the source but it should be "P1.JPG" in your case. Once you correct this the images will be visible.
    Last edited by codeexploiter; 01-17-2008 at 11:07 AM.

  3. #3
    Join Date
    Jan 2008
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Thanks Codeexploiter,
    It worked like a charm. Why does it matter though, when I've seen other examples using lower case jpg? Anyhow, thanks again.
    Dan

  4. #4
    Join Date
    Jan 2008
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Never mind, I get it.

Bookmarks

Posting Permissions

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