You are here:   Home > Scripts > Javascript Drag and Drop

Home    |    Candybar    DollMakers    RoomMakers    |    Roiworld    BBDI    Star Dolls    |    Puzzles    Smilies    Links   

Back to Scripts

Javascript, How to make a Dress Up Game (Drag and Drop)



A lot of doll maker sites uses this script to make their doll pieces draggable. This version would work on BOTH ie and netscape (original script by DynamicDrive)

Just add the field (i.e. class="dragme") to make an image draggable is all that is required. The z order of the images is determined by which image is created last (the last image will be the top most image)

Below we set the three images placed inside a table (could just as well be a div) and assigned the classname "dragme" to each of them

Try dragging the smileys below (Tested on on IE4+, Netscape6+ (NS6) and Firefox for Windows)


To enable drag and drop for your images just include (copy and paste) the javascript source below in your HTML document inside the HEAD tags <head> .and </head> section.

Javascript Source



Which the class="dragme" to whichever image you wish to make draggable
See below:
..
<img src="images/AIM_smiley.gif" class="dragme"> ..





References:
Dynamic Drive: For the original script



Creative Commons License All work by eLouai is licensed under a Creative Commons Attribution 3.0 Unported License
contact: elouai@gmail.com        ©2003-2014 eLouai.com, All rights reserved        Hosting by Web Hosting Canada        Privacy Policy        About