Drag and Drop Images, Draggable Image Move Script - FREE Javascript<title> <meta http-equiv="Content-Type" content="text/html;charset=utf-8"> <style TYPE="text/css">  </STYLE> <link rel="shortcut icon" href="http://hscripts.com/images/favicon.gif"> <link rel="meta" href="http://www.hscripts.com/labels.rdf" type="application/rdf+xml" title="ICRA labels" />  </head> <body style="margin: 0px; font-family: Serif, Arial,Times, serif;"> <table width=100% height=100% cellpadding=0 cellspacing=0 class="firsttab">  <tr width=100% height=10%> <td width=100%>  <table width=100% align=center cellpadding=0 cellspacing=0> <tr><td> <script language=javascript> var ajss = "./"; </script>  <table width=100% height=80 align=center cellpadding=1 cellspacing=1 background="../../images/bg.gif"><tr> <td width=30% align=left> <div align=left class="hiox"> H I O X INDIA </div> <div align=left class="heading"> FREE Javascript</div> </td> <td align=center> <img src="../../images/hscripts.gif" border=0> </td> <td valign=center align=right width=30%> <table cellpadding=0 cellspacing=0 border=0 > <tr><td align=center>  <table height=80 width=220 border="0" background="http://hscripts.com/images/test3.gif" cellpadding=0 cellspacing=0> <tr><td align=center> <form action="http://www.hscripts.com/search.php" id="cse-search-box"> <div> <input type="hidden" name="cx" value="partner-pub-3229609591361912:tr32dstt7u" /> <input type="hidden" name="cof" value="FORID:10" /> <input type="hidden" name="ie" value="ISO-8859-1" /> <input type="text" name="q" size="20" /><br> <input type="submit" name="sa" value="Search" /> </div> </form> <script type="text/javascript" src="http://www.google.com/coop/cse/brand?form=cse-search-box&lang=en"></script> </td></tr></table>  </td></tr></table> <script type='text/javascript' src='http://hscripts.com/select-code.js'></script> </td> </tr></table>  </td></tr>  <style> .scale{color: #454545; font-weight: bold; font-size: 13px;} .result{ color: #ffffff; font-family: arial, verdana; background-color: #44dd55; margin: 2px; font-size: 12px;} .result1{ color: #ffffff; font-family: arial, verdana; font-weight: bold; background-color: #ff4433; margin: 3px; font-size: 12px;} .result2{ color: #ffffff; font-family: arial, verdana; font-weight: bold;background-color: #aa9a9a; margin: 3px; font-size: 12px;} h1{font-size: 17px; font-weight: bold; font-family: san-serif, verdana, arial; color: 0000ff; padding-top: 10px;} /* Styles For DNS INDEX Table */ .dnstab1{font-family: arial, verdana, san-serif; font-size: 13px; color: #000044; background-color: #f1efea; padding: 5px; text-align: center; border: 0px solid #d1aeae;} .dnstab{font-family: arial, verdana; font-size:12px; border: 0px solid #006600; background-color: #f3f7f3; padding: 5px; } .taba{border: 1px solid #ddffaa;} .trans{text-decoration: none; color: #000044;} .trans:hover {color: #1D1AAB;} .atag{font-size:12px; font-family: arial, verdana, san-serif; text-decoration:none; color:green;} .atag:hover{text-decoration:underline;} /* End of Dns Index page Table */ .new{font-family: arial,verdana; margin: 1px; font-size:13px; border:1px solid #afc784; padding-left: 2px;} .new1{font-family: arial,verdana; margin: 1px; font-size:13px; color: #000000; background-color:#afc784; padding-left:3px;} .new2{font-family: arial,verdana; margin: 1px; font-size:13px; color: #000055; padding-left:2px;} .field{font-family: arial, verdana, san-serif; margin: 1px; font-size: 13px; font-weight: bold; color: #000055; background-color:#ffffff; padding-left:3px; border:0px solid #660000} /*style for tooltip*/ .crclass { cursor:pointer; color:blue; } #bubble_tooltip{width:300px;position:absolute;display: none;} #bubble_tooltip .bubble_top{position:relative; background-image: url(http://hscripts.com/images/bubble_top.gif);background-repeat:no-repeat;height:18px;} #bubble_tooltip .bubble_middle{position:relative;background-image: url(http://hscripts.com/images/bubble_middle.gif);background-repeat: repeat-y; background-position: bottom left;} #bubble_tooltip .bubble_middle div{padding-left: 12px;padding-right: 20px;position:relative;font-size: 11px;font-family: arial, verdana, san-serif;text-decoration: none;color: red;text-align:justify;} #bubble_tooltip .bubble_bottom{background-image: url(http://hscripts.com/images/bubble_bottom.gif);background-repeat:no-repeat;height:65px;position:relative;top: 0px;} /*style for tooltip end*/ /* Style for php tutorial*/ .syntax{color:brown; font-weight:bold; text-align:center; } .lnk{text-decoration:none; color:#0690FA;} .ex{margin-left:15px; color:#998322;} .cmt{ color:#D2691E; font-style:italic; font-size:12px;} .ref{ text-decoration:none;color:#0000cd;} /* Style for php tutorial*/ </style>  <tr><td bgcolor="#eeffee">  <style> .tab{font-family: arial, verdana, san-serif; font-size: 14px;} .asd{text-decoration: none; cursor: pointer; font-family: arial, verdana, san-serif; font-size: 12px; color: #505050;} .row1{background-color: #ffffee;} .row2{background-color: #edf8d7;} </style> <script language=javascript> var color1 = "#ffffee"; var color2 = "#edf8d7"; var mouseocolor = "#FFFFFF"; var sitename = "hscripts.com"; window.onerror = null; var bName = navigator.appName; var bVer = parseInt(navigator.appVersion); var IE4 = (bName == "Microsoft Internet Explorer" && bVer >= 4); var menuActive = 0; var menuOn = 0; var onLayer; var timeOn = null; var colnow = color1; var url = encodeURIComponent(window.location); var title = encodeURIComponent(document.title); var sitename = "hscripts.com"; //set the bookmark link, where you want(topright,topleft,bottomright,bottomleft) var corner = "bottomright"; function bookmark(title,url){ if(window.sidebar) window.sidebar.addPanel(title,url,""); else if(window.opera && window.print){ var elem = document.createElement('a'); elem.setAttribute('href',url); elem.setAttribute('title',title); elem.setAttribute('rel','sidebar'); elem.click(); } else if(os == "ie") window.external.AddFavorite(url,title); } document.write('<div id=ddd style="z-index: 1000; position: absolute; visibility: visible; padding: 2px; left:5px; top: 5px; border: 0px solid green;"><img src="http://hscripts.com/images/share.gif" border="0" usemap="#Map" style=\'border: 0px solid gray;\' width=135><map name="Map" id="Map"><area shape="circle" coords="15,10,9" href="http://hscripts.com" /></map><br><div style="background-color: #d3d3d3;" width=138><a rel="nofollow" onclick=wopmove("twitter") target="_blank" style="font-size:14px; padding-left: 3px; text-decoration: none; cursor: pointer;" title="Twitter"><img src="http://twitter.com/favicon.ico" alt="twitter" border=0"></a><a rel="nofollow" target="_blank" style="font-size:14px; padding-left: 3px; text-decoration: none; cursor: pointer;" onclick=wopmove("orkut") title="Orkut"><img src="http://img2.orkut.com/favicon.ico" alt="orkut" border=0"></a><a rel="nofollow" style="font-size:14px; padding-left: 3px; text-decoration: none; cursor: pointer;" onclick=wopmove("facebook") title="facebook"><img src="http://facebook.com/favicon.ico" alt="Bookmark" border=0"></a><a rel="nofollow" style="font-size:14px; text-decoration: none; cursor: pointer; padding-left: 3px; cursor: pointer;" onclick=wopmove("google") title="google"><img src="http://google.com/favicon.ico"></a><a rel="nofollow" style="font-size:14px; padding-left: 3px; text-decoration: none; cursor: pointer;" onclick=wopmove("delicious") title="delicious"><img src="http://delicious.com/favicon.ico" alt="Bookmark" border=0"></a><a rel="nofollow" style="font-size:14px; cursor: pointer; padding-left: 3px; text-decoration: none;" onclick=wopmove("digg") title="Digg"><img src="http://digg.com/favicon.ico" alt="Bookmark" border=0"></a><a rel="nofollow" target="_blank" style="font-size:14px; padding-left: 3px; text-decoration: none; cursor: pointer;" onclick=wopmove("stumbleupon") title="Stumble upon"><img src="http://hscripts.com/images/stumble-upon.gif" alt="stumble upon" border=0"></a></div></div>'); var os; if(document.layers) os = "n4"; else if(document.getElementById&&!document.all) os = "n6"; else if(document.all) os = "ie"; //Function to scroll the bookmark images throughout the page function run() { var dda = document.getElementById('ddd'); if(os == "ie"){ pwidth = window.document.body.offsetWidth; pheight = window.document.body.offsetHeight; stop = document.body.scrollTop; sleft = document.body.scrollLeft; setTimeout('run()',5); }else{ pwidth = window.innerWidth; pheight = window.innerHeight; stop = window.pageYOffset; sleft = window.pageXOffset; document.getElementById('ddd').style.position = 'fixed'; } if(corner == "topleft"){ dda.style.top = (stop+15)+"px"; dda.style.left = (sleft+15)+"px"; }else if(corner == "topright"){ dda.style.top = (stop)+"px"; dda.style.left = (sleft+pwidth-70)+"px"; }else if(corner == "bottomleft"){ dda.style.top = (stop+pheight-43)+"px"; dda.style.left = (sleft+15)+"px"; }else if(corner == "bottomright"){ dda.style.top = (stop+pheight-70)+"px"; dda.style.left = (sleft+pwidth-280)+"px"; } // setTimeout('run()',5); } function wopmove(id) { //alert(title); window.location = "http://zxc9.com/seo.php?type="+id+"&title="+title+"&url="+url; } document.onload = run(); function showLayer(layerName,aa){ var x =document.getElementById(aa); var tt =findPosX(x); var ww =findPosY(x)+18; //alert(tt+"---"+ww); if (timeOn != null) { clearTimeout(timeOn); hideLayer(onLayer); } if (IE4) { var layers = eval('document.all["'+layerName+'"].style'); layers.left = tt; layers.top = ww; eval('document.all["'+layerName+'"].style.visibility="visible"'); } else { if(document.getElementById){ var elementRef = document.getElementById(layerName); if((elementRef.style)&& (elementRef.style.visibility!=null)){ elementRef.style.visibility = 'visible'; elementRef.style.left = tt; elementRef.style.top = ww; } } } onLayer = layerName } function hideLayer(layerName){ if (menuActive == 0) { if (IE4){ eval('document.all["'+layerName+'"].style.visibility="hidden"'); } else{ if(document.getElementById){ var elementRef = document.getElementById(layerName); if((elementRef.style)&& (elementRef.style.visibility!=null)){ elementRef.style.visibility = 'hidden'; } } } } } function btnTimer() { timeOn = setTimeout("btnOut()",600) } function btnOut(layerName){ if (menuActive == 0){ hideLayer(onLayer) } } var item; function menuOver(itemName){ item=itemName; itemName.style.backgroundColor = mouseocolor; //background color change on mouse over clearTimeout(timeOn); menuActive = 1 } function menuOut(itemName,iid){ if(iid == 1) colnow = color1; else colnow = color2; if(item) itemName.style.backgroundColor = colnow; menuActive = 0 timeOn = setTimeout("hideLayer(onLayer)", 100) } function findPosX(obj) { var curleft = 0; if (obj.offsetParent) { while (obj.offsetParent) { curleft += obj.offsetLeft obj = obj.offsetParent; } } else if (obj.x) curleft += obj.x; return curleft; } function findPosY(obj) { var curtop = 0; if (obj.offsetParent) { while (obj.offsetParent) { curtop += obj.offsetTop obj = obj.offsetParent; } } else if (obj.y) curtop += obj.y; return curtop; } </script> <div id=Menu251 style="position:absolute; border:1px solid #000000; visibility:hidden; z-index: 1"> <table cellspacing=0 cellpadding=0 style="border-collapse: collapse;"> <tr class=row1 height=22 onmouseout=menuOut(this,1) onmouseover=menuOver(this)> <td align=left> <a class= asd href="http://www.hscripts.com/scripts/php/index.php"> PHP Script </a> </td></tr> <tr class=row2 height=22 onmouseout=menuOut(this,2) onmouseover=menuOver(this)> <td align=left> <a class=asd href="http://www.hscripts.com/scripts/JavaScript/index.php"> Java Script </a> </td></tr> <tr class=row1 height=22 onmouseout=menuOut(this,1) onmouseover=menuOver(this)> <td align=left> <a class=asd href="http://www.hscripts.com/scripts/jsp/index.php"> JSP Script </a> </td></tr> <tr class=row2 height=22 onmouseout=menuOut(this,2) onmouseover=menuOver(this)> <td align=left> <a class=asd href="http://www.asp.hscripts.com/"> ASP Script </a> </td></tr> <tr class=row1 height=22 onmouseout=menuOut(this,1) onmouseover=menuOver(this)> <td align=left> <a class=asd href="http://hscripts.com/scripts/php/licensed/index.php"> Licensed Scripts </a> </td></tr> </table></div> <div id=Menu252 style="position:absolute; border:1px solid #000000; visibility:hidden; z-index: 1"> <table cellspacing=0 cellpadding=0 style="border-collapse: collapse;"> <tr class=row1 height=22 onmouseout=menuOut(this,1) onmouseover=menuOver(this)> <td align=left> <a class= asd href="http://www.hscripts.com/scripts/php/licensed/"> Licensed Scripts </a> </td></tr> <tr class=row2 height=22 onmouseout=menuOut(this,2) onmouseover=menuOver(this)> <td align=left> <a class=asd href="http://www.hscripts.com/premium-icons/">Premium Icons</a> </td></tr> </table></div> <div id=Menu253 style="position:absolute; border:1px solid #000000; visibility:hidden; z-index: 1"> <table cellspacing=0 cellpadding=0 style="border-collapse: collapse;"> <tr class=row1 height=22 onmouseout=menuOut(this,1) onmouseover=menuOver(this)> <td align=left> <a class= asd href="http://www.hscripts.com/tutorials/html/index.php"> HTML Tutorials </a></td></tr> <tr class=row2 height=22 onmouseout=menuOut(this,2) onmouseover=menuOver(this)> <td align=left> <a class=asd href="http://www.hscripts.com/tutorials/css/index.php">CSS Tutorials </a></td></tr> <tr class=row1 height=22 onmouseout=menuOut(this,1) onmouseover=menuOver(this)> <td align=left> <a class= asd href="http://www.hscripts.com/tutorials/javascript/index.php">JavaScript Tutorials </a> </td></tr> <tr class=row2 height=22 onmouseout=menuOut(this,2) onmouseover=menuOver(this)> <td align=left> <a class= asd href="http://www.hscripts.com/tutorials/jsp/index.php">JSP Topics</a> </td></tr> <tr class=row1 height=22 onmouseout=menuOut(this,1) onmouseover=menuOver(this)> <td align=left> <a class=asd href="http://www.hscripts.com/tutorials/mysql/index.php">MYSQL Tutorials </a> </td></tr> <tr class=row2 height=22 onmouseout=menuOut(this,2) onmouseover=menuOver(this)> <td align=left> <a class=asd href="http://www.hscripts.com/tutorials/photoshop/index.php">Photoshop Tutorials </a> </td></tr> <tr class=row1 height=22 onmouseout=menuOut(this,1) onmouseover=menuOver(this)> <td align=left> <a class= asd href="http://www.hscripts.com/tutorials/php/index.php"> PHP Topics</a> </td></tr> <tr class=row2 height=22 onmouseout=menuOut(this,2) onmouseover=menuOver(this)> <td align=left> <a class= asd href="http://www.hscripts.com/tutorials/perl/index.php"> Perl Tutorial</a> </td></tr> <tr class=row1 height=22 onmouseout=menuOut(this,1) onmouseover=menuOver(this)> <td align=left> <a class=asd href="http://www.hscripts.com/tutorials/regular-expression/index.php">Regular Expression </a> </td></tr> <tr class=row2 height=22 onmouseout=menuOut(this,2) onmouseover=menuOver(this)> <td align=left> <a class=asd href="http://www.hscripts.com/tutorials/linux-commands/index.php">Unix Commands</a> </td></tr> <tr class=row1 height=22 onmouseout=menuOut(this,1) onmouseover=menuOver(this)> <td align=left> <a class=asd href="http://www.hscripts.com/tutorials/linux-services/index.php">Linux services</a></td></tr> <tr class=row2 height=22 onmouseout=menuOut(this,2) onmouseover=menuOver(this)> <td align=left> <a class= asd href="http://www.hscripts.com/tutorials/SEO/index.php"> SEO Tutorial</a></td></tr> <tr class=row1 height=22 onmouseout=menuOut(this,1) onmouseover=menuOver(this)> <td align=left> <a class= asd href="http://www.hscripts.com/tutorials/web/domain-names.php"> Domain & DNS</td></tr> </table></div> <div id=Menu254 style="position:absolute; border:1px solid #000000; visibility:hidden; z-index: 1"> <table cellspacing=0 cellpadding=0 style="border-collapse: collapse;"> <tr class=row1 height=22 onmouseout=menuOut(this,1) onmouseover=menuOver(this)> <td align=left> <a class= asd href="http://www.hscripts.com/freeimages/icons/"> Gif Icons & Clipart</a> </td></tr> <tr class=row2 height=22 onmouseout=menuOut(this,2) onmouseover=menuOver(this)> <td align=left> <a class=asd href="http://www.hscripts.com/freeimages/background/">Background Images </a> </td></tr> <tr class=row1 height=22 onmouseout=menuOut(this,1) onmouseover=menuOver(this)> <td align=left> <a class= asd href="http://www.hscripts.com/freeimages/icons/menu-buttons/index.php"> Menu buttons </a> </td></tr> <tr class=row2 height=22 onmouseout=menuOut(this,2) onmouseover=menuOver(this)> <td align=left> <a class= asd href="http://www.hscripts.com/freeimages/maps/map-icons.php"> Your Country </a> </td></tr> </table></div> <div id=Menu255 style="position:absolute; border:1px solid #000000; visibility:hidden; z-index: 1"> <table cellspacing=0 cellpadding=0 style="border-collapse: collapse;"> <tr class=row1 height=22 onmouseout=menuOut(this,1) onmouseover=menuOver(this)> <td align=left> <a class= asd href="http://www.hscripts.com/tools/ButtonCreator/index.php"> Button Creator </a> </td></tr> <tr class=row2 height=22 onmouseout=menuOut(this,2) onmouseover=menuOver(this)> <td align=left> <a class=asd href="http://www.hscripts.com/tools/form-generator/index.php"> Form Generator</a> </td></tr> <tr class=row1 height=22 onmouseout=menuOut(this,1) onmouseover=menuOver(this)> <td align=left> <a class=asd href="http://hscripts.com/tools/case-conversion/index.php"> Case Converter</a> </td></tr> <tr class=row2 height=22 onmouseout=menuOut(this,2) onmouseover=menuOver(this)> <td align=left> <a class= asd href="http://www.hscripts.com/tools/drop-down-menu/index.php"> Menu Builder </a> </td></tr> <tr class=row1 height=22 onmouseout=menuOut(this,1) onmouseover=menuOver(this)> <td align=left> <a class=asd href="http://www.hscripts.com/tools/HLPC/index.php">Website Popularity </a> </td></tr> <tr class=row2 height=22 onmouseout=menuOut(this,2) onmouseover=menuOver(this)> <td align=left> <a class= asd href="http://www.hscripts.com/tools/HPR/index.php"> Page Rank Checker </a> </td></tr> <tr class=row1 height=22 onmouseout=menuOut(this,1) onmouseover=menuOver(this)> <td align=left> <a class= asd href="http://www.hscripts.com/tools/BrokenLinkChecker/index.php"> Link Analyzer </a> </td></tr> <tr class=row2 height=22 onmouseout=menuOut(this,2) onmouseover=menuOver(this)> <td align=left> <a class=asd href="http://www.hscripts.com/tools/web-page-color/index.php"> Color Chooser </a> </td></tr> <tr class=row1 height=22 onmouseout=menuOut(this,1) onmouseover=menuOver(this)> <td align=left> <a class= asd href="http://www.hscripts.com/tools/HDNT/index.php"> DNS Lookup </a> </td></tr> <tr class=row2 height=22 onmouseout=menuOut(this,2) onmouseover=menuOver(this)> <td align=left> <a class=asd href="http://www.hscripts.com/tools/HVLT/index.php">Apache Ver Lookup </a> </td></tr > <tr class=row1 height=22 onmouseout=menuOut(this,1) onmouseover=menuOver(this)> <td align=left> <a class=asd href="http://www.hscripts.com/tools/statistics/index.php">Statistics </a> </td></tr> <tr class=row2 height=22 onmouseout=menuOut(this,2) onmouseover=menuOver(this)> <td align=left> <a class=asd href="http://www.hscripts.com/tools/unix-timestamp/index.php">Epoch-GMT Converter</a> </td></tr> </table></div> <table border=0 align=center width=100% background='http://hscripts.com/images/bg2.jpg' style="background-color: rgb(230,245,230); border-top: 0px solid green; border-bottom: 1px solid green;"> <tr align=center valign=bottom><td align=center valign=center> <table width=100% align=center cellpadding=1 cellspacing=0 border="0"> <tr> <td align=center colspan=3> <a href="../../index.php" ><img height=15 border=0 src="http://hscripts.com/images/house.gif"></a> <a href="../../index.php" class=mainstyle> HOME </a> || <a id=251 onmouseout=btnTimer() onmouseover=showLayer("Menu251",'251') class=mainstyle href="../index.php" > Scripts </a> || <a id=252 onmmouseout=btnTimer() onmouseover=showLayer("Menu252",'252') class=mainstyle href="../../scripts/php/licensed/index.php"> Purchase </a> || <a id=253 onmouseout=btnTimer() onmouseover=showLayer("Menu253",'253') href="../../tutorials/index.php" class=mainstyle> Tutorials </a> || <a id=254 onmouseout=btnTimer() onmouseover=showLayer("Menu254",'254') href="../../freeimages/index.php" class=mainstyle> Images </a> || <a id=255 onmouseout=btnTimer() onmouseover=showLayer("Menu255",'255') href="../../tools/index.php" class=mainstyle> Tools </a> || <a target="_blank" href="http://freedesignertemplates.com" class=mainstyle> Templates </a> </td></tr> <style> a#a2{text-decoration: none; color: #7777ee;} a#a2:hover{text-decoration: none; color: #77aaff;} </style> <tr align=center valign=bottom> <td width=20%> </td> <td align=center valign=center> <table id=linkaa cellpadding=0 cellspacing=0 style="margin-top: -1px;"> <tr><td style="padding-top: 1px; background-color: #E5FCDA; color: green; font-size: 13px;"> :-) <a class=hlinks href="../../sendpage.php">Send Page</a> :-) <a class=hlinks href="http://www.hscripts.com/feedback.php">Feedback</a> :-) <a class=hlinks href="../../regpage.php">Register</a> :-) <a class=hlinks href="../../links.php">Links</a> :-) <a class=hlinks href="../../support.php">Support</a> :-)    </td> </tr></table>  <td width="20%"> <a href="http://es.hscripts.com"><img src="http://hscripts.com/images/spain-flag.gif" border=0 alt="Español" title=" Español"></a> <a href="http://fr.hscripts.com"><img src="http://hscripts.com/images/france-flag.gif" border=0 alt="Français" title="Français"></a> <a href="http://cn.hscripts.com"><img src="http://hscripts.com/images/chinese-flag.gif" border=0 alt="中文" title=" 中文"></a> <a href="http://de.hscripts.com"><img src="http://hscripts.com/images/german-flag.gif" border=0 alt="Deutsch" title="Deutsch"></a> <a href="http://pt.hscripts.com"><img src="http://hscripts.com/images/portuguese.gif" border=0 alt="Portuguese" title="Portuguese"></a> <a href="http://ja.hscripts.com"><img src="http://hscripts.com/images/japanese-flag.gif" border=0 style='border: 1px solid #d3d3d3;' alt="Japanese" title="Japanese"></a> <a href="http://ta.hscripts.com"><img src="http://hscripts.com/images/tamil-flag.gif" border=0 alt="தமிழ்" title="தமிழ்"></a> </td>  </td></tr> <tr align=center><td align=center colspan="3"> <a id=a2 href="http://www.forums.hscripts.com" target=_blank> Forums </a> <a id=a2 href="http://www.hioxindia.com" target=_blank> Hosting </a> <a id=a2 href="http://www.tofocus.info" target=_blank> Internet Stats </a> <a id=a2 href="http://www.easycalculation.com" target=_blank> Easy Calculation </a> <a id=a2 href="http://www.funmin.com" target=_blank> FUN Games </a> </td></tr> </table> </td></tr> </table>  </td></tr> </table>  </td></tr>   <tr height=90%> <td height=100%>  <table width=100% height=100% cellpadding=0 cellspacing=0 class="contenttable">  <tr height=100%> <td height=100%>  <table width=100% height=100% cellpadding=0 cellspacing=0 border=0 bgcolor=#b5daa9> <tr><td width=20%> <table valign=top align=center height=100% width=100% class="leftbox" cellpadding=0> <tr><td align=center> <br>  <script language=javascript src="expander.js"> </script> <table width=95% style="border: green solid 1px;" cellspacing=1 border=0> <tr><td class="lefttitle" height=25 align=center> <b>Java Script Source</b> </td></tr> <tr><td class=topics> <img src="../../images/icon.gif"> <a class=topics1 href="./index.php">List All</a> </td></tr> <tr><td id=datetime onclick="addChilds('datetime')" class=topics><img src="../../images/icon.gif"> <font class=topics1>Date & Time</font></td></tr> <tr><td class=topics><img src="../../images/icon.gif"> <a class=topics1 href="./calendar.php">Calendar</a> </td></tr> <tr><td id=stwatch onclick="addChilds('stwatch')" class=topics><img src="../../images/icon.gif"> <font class=topics1>Stop Watch script</font></td></tr> <tr><td id=slide onclick="addChilds('slide')" class=topics><img src="../../images/icon.gif"> <font class=topics1>Slide Show</font> </td></tr> <tr><td class=topics><img src="../../images/icon.gif"> <a class=topics1 href="./greybox.php">Ad Display</a> </td></tr> <tr><td id=anim onclick="addChilds('anim')" class=topics><img src="../../images/icon.gif"> <font class=topics1>Animated Image Effects</font> </td></tr> <tr><td id=imgeffect onclick="addChilds('imgeffect')" class=topics><img src="../../images/icon.gif"> <font class=topics1>Image Effect</font></td></tr> <tr><td id=mouseon onclick="addChilds('mouseon')" class=topics><img src="../../images/icon.gif"> <font class=topics1>Mouse Effects</font> </td></tr> <tr><td class=topics><img src="../../images/icon.gif"> <a class=topics1 href="./select-color-pallete.php">Color Picker Tool</a> </td></tr> <tr><td id=clrchange onclick="addChilds('clrchange')" class=topics><img src="../../images/icon.gif"> <font class=topics1>Dynamic Color</font></td></tr> <tr><td id=random onclick="addChilds('random')" class=topics><img src="../../images/icon.gif"> <font class=topics1>Random Generator</font></td></tr> <tr><td id=select onclick="addChilds('select')" class=topics><img src="../../images/icon.gif"> <font class=topics1>Select All</font></td></tr> <tr><td id=frms onclick="addChilds('frms')" class=topics><img src="../../images/icon.gif"> <font class=topics1>Form Validation</font></td></tr> <tr><td id=fmtfrms onclick="addChilds('fmtfrms')" class=topics><img src="../../images/icon.gif"> <font class=topics1>Formatting Forms</font></td></tr> <tr><td id=txtbox onclick="addChilds('txtbox')" class=topics><img src="../../images/icon.gif"> <font class=topics1>Textbox Counter</font></td></tr> <tr><td id=dynamic onclick="addChilds('dynamic')" class=topics><img src="../../images/icon.gif"> <font class=topics1>Dynamic Form select</font></td></tr> <tr><td class=topics><img src="../../images/icon.gif"> <a class=topics1 href="./bookmark.php">Bookmark</a> </td></tr> <tr><td id=userinfo onclick="addChilds('userinfo')" class=topics><img src="../../images/icon.gif"> <font class=topics1>Window / User Info</font></td></tr> <tr><td id=pagi onclick="addChilds('pagi')" class=topics><img src="../../images/icon.gif"> <font class=topics1>Pagination</font></td></tr> <tr><td id=security onclick="addChilds('security')" class=topics><img src="../../images/icon.gif"> <font class=topics1>Security / Authenticate</font></td></tr> <tr><td id=status onclick="addChilds('status')" class=topics><img src="../../images/icon.gif"> <font class=topics1>Status Bar</font></td></tr> <tr><td id=title onclick="addChilds('title')" class=topics><img src="../../images/icon.gif"> <font class=topics1>Title Bar</font></td></tr> <tr><td id=position onclick="addChilds('position')" class=topics><img src="../../images/icon.gif"> <font class=topics1>Cursor Position</font></td></tr> <tr><td id=country onclick="addChilds('country')" class=topics><img src="../../images/icon.gif"> <font class=topics1>Country List</font> </td></tr> <tr><td id=calcu onclick="addChilds('calcu')" class=topics><img src="../../images/icon.gif"> <font class=topics1>Calculators</font></td></tr> <tr><td id=deleteDuplicate onclick="addChilds('deleteDuplicate')" class=topics><img src="../../images/icon.gif"> <font class=topics1>Delete Repeated Values</font></td></tr> <tr><td class=topics><img src="../../images/icon.gif"> <a class=topics1 href="./alphanumeric-check.php">Alphanumeric</a> </td></tr> <tr><td id=game onclick="addChilds('game')" class=topics><img src="../../images/icon.gif"> <font class=topics1>Free Games</font></td></tr>   </table> <br> </td></tr> <tr><td align=center>    <br> <div align=center><a alt="track, manage link submission status" href="http://www.buildmylink.com" target=_blank> <img alt="" src="../../images/buildmylink-ad.gif" border=0></a></div><br> </td></tr> <tr><td> <br><br> </td></tr>  <tr><td height=90%> </td></tr> </table> </td><script type="text/javascript"> document.onload=addChilds('position'); </script> <td width=60% valign=top class="mainbox"> <div align=center> <table width=100% cellpadding=0 cellspacing=0 align=center> <tr><td background="../../images/center.JPG" height=40 align=center> <h3 class="scriptname">Drag and Drop Script</h3> </td></tr> </table><br> <div align="center"> <table cellpadding=0 cellspacing=0 width=95%> <tr><td class="abouttablehead"><b>About</b></td></tr> <tr><td class="abouttabletext"> A simple javascript used to move images on a web page. Use this script to create drag and drop applications on your pages. Try dragging the image below by a mouse click. </td></tr> </table> <br> <table align=center cellpadding=0 cellspacing=0 width=95%> <tr><td class="abouttablehead"> <b></b></td></tr> <tr><td align=left> <script type="text/javascript"> </script> <script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"> </script> </td></tr> </table> <br><table cellpadding=0 cellspacing=0 width=95% align=center> <tr><td class="abouttablehead"><b>Features</b></td></tr> <tr><td class="abouttabletext"> a) Converts images on a page to a draggable one.<br> b) Customizable Width, Height properties.<br> c) The script can be used only with relative and absolute elements.<br> b) Easy to move elements up, down, right and left. </td></tr> </table> <br><table cellpadding=0 cellspacing=0 width=95% align=center> <tr><td class="abouttablehead"><b>Preview</b></td></tr> <tr><td align=center class="abouttabletext"><br> Simply Click, Drag and Drop the image <style type="text/css"> .dragme{position:relative;} </style> <script type="text/javascript"> 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,10); ty = parseInt(dobj.style.top+0,10); 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> <table><tr><td align="center"> <img src="himages/flower.jpg" width="270" height="203" alt="drag-and-drop image script" style="cursor:move;" title="drag-and-drop image script" class="dragme"><a href="http://hscripts.com" style="text-decoration:none;cursor:pointer;font-size:12px;color:green;">H</a> </td></tr></table> </td></tr> </table> <br> <table align=center cellpadding=0 cellspacing=0 width=95%> <tr><td class="abouttablehead"> <b></b></td></tr> <tr><td class="abouttabletext" align=left> <script type="text/javascript"> iiiidd="php_scripts_125_125"; </script> <script type="text/javascript" src="../../dad/hioxad.js"></script> </td></tr> </table> <br><table cellpadding=0 cellspacing=0 width=95% align=center> <tr><td class="abouttablehead"><b>Code</b></td></tr> <tr><td class="abouttabletext"><b>Javascript Code</b> <div class="copybox" id="selectcode"> <pre>    <script type="text/javascript"> 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,10); ty = parseInt(dobj.style.top+0,10); 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> <br> </pre></div> <input type="button" value="Select Code" onclick="fnSelect('selectcode')" style='margin-left:320px;background-color:#eff7ff;border:solid 1px #342d7a;'> <br> HTML Code <div class="copybox" id="selectcode1"> <pre> <style type="text/css"> .dragme{position:relative;} </style> <table><tr><td align="center"> <img src="./flower.jpg" width="270" height="203" alt="drag-and-drop image script" style="cursor:move;" title="drag-and-drop image script" class="dragme"><a href="http://hscripts.com" style="text-decoration:none;cursor:pointer;font-size:12px;color:green;">H</a> </td></tr></table> </pre> </div> <input type="button" value="Select Code" onclick="fnSelect('selectcode1')" style='margin-left:320px;background-color:#eff7ff;border:solid 1px #342d7a;'> <br> Release Date - 18-09-2009.<br><br> <b>Downloads:</b><a href="downloads/hdrag-and-drop.zip" style="text-decoration:none;">hdrag-and-drop.zip</a> <br><br> Get free version without ©copyright link for just <a style="text-decoration:none;" href="../../order.php?order=free&name=Drag and Drop Script"> <span style="color:green; font-size:18px; vertical-align: 20%;">5</span> <img id=img6 src=../../images/doller.gif border=0></a><br><br> For customization of this script or any script development, contact us at <a href="mailto:support@hscripts.com">support@hscripts.com</a> <br><br></td></tr> </table><br> <table cellpadding=0 cellspacing=0 width=95% align=center> <tr><td class="abouttablehead"><b>Usage</b></td></tr> <tr><td class="abouttabletext"> a) Download and Unzip Drag and Drop image script and execute drag-and-drop.html file. <b>or</b><br> b) Just Copy and paste the javascript code into your HTML page.<br> c) Set the Height and Width properties as per your requirement.<br> d) Make the images draggable using this script.<br> e) This move script is compatible with IE and Firefox.<br> f) Free download.<br> </td></tr> </table><br> <table align=center cellpadding=0 cellspacing=0 width=95%> <tr><td class="abouttablehead"> <b></b></td></tr> <tr><td class="abouttabletext" align=left> <script type="text/javascript"> iiiidd="php_scripts_125_125"; </script> <script type="text/javascript" src="../../dad/hioxad.js"></script> </td></tr> </table> <br> <table align=center cellpadding=0 cellspacing=0 width=95%> <tr><td class="abouttablehead"> <b>License</b></td></tr> <tr><td class="abouttabletext"> - This javascript (misspelled as java script)/HTML code is given under GPL License<br> - i.e. Free use for those who use it as it is. <br> - Free, if your modification does not remove our copyright information and links.<br> - Detailed License information can be found <a href="../../license/hioxlicense.html">here</a><br> - You can <b>purchase</b> the script if your requirements does not meet GPL License terms.<br> </td></tr> </table> <br><br> </div> <table width=100% cellpadding=0 cellspacing=0 align=center><tr> <td background="../../images/center.JPG" height=40 align=center> <a href="../../license/ppolicy.html" class="downlink">privacy policy</a> <a href="../../license/hioxlicense.html" class="downlink">license</a> <a href="../../sitemap.php" class="downlink">sitemap</a><br> <span style="font-size: 12px;">© 2004-2010 <a style="font-size: 12px; text-decoration: none;" href=http://www.hiox.com>HIOX INDIA</a></span> </td></tr> </table> </td>  <td width=20% class="addcol" valign=top>  <table valign=top align=center height=100% width=100% class="addbox"> <tr><td valign=top align=center> <br> <table valign=top align=center height=70% width=95% style="border: green solid 1px;" cellspacing=0> <tr><td class="lefttitle" height=25 align=center> <b>Others</b></td></tr> <tr><td class="topics" valign=top> <div align=center> <script type="text/javascript"> iiiidd="group_120_600"; </script> <a href='http://codingcoding.com'><img src='../../images/coding_coding.jpg'></a><br> <script type="text/javascript" src="../../dad/hioxad.js"></script> </div> </td></tr> </table> </td></tr> </table>  </td>  </tr></table>  </td></tr>   <tr style="background-color: #ffffff;"><td> </td></tr>  </table>  </td></tr>  </table> </body> </html>