Vous ne trouvez pas de réponse à votre problème ? Alors posez la question dans le forum. Souvenez-vous qu'il n'y a jamais de question bête, mais rester dans l'ignorance parce que l'on n'ose pas poser une question, ça c'est une erreur !

FONCTION PERMETTANT D'INDIQUER À UN ÉLÉMENT QU'IL PEUT ÊTRE DÉPLACÉ PAR DRAG & DROP


Information sur la source

Catégorie :Effets Classé sous : DrapDrop, DropPoint, Déplacement Niveau : Initié Date de création : 19/08/2004 Date de mise à jour : 15/12/2007 12:57:16 Vu / téléchargé: 6 279 / 1 585

Note :
9,4 / 10 - par 5 personnes
9,40 / 10

  • 1

  • 2

  • 3

  • 4

  • 5

  • 6

  • 7

  • 8

  • 9

  • 10

Commentaire sur cette source (11)
Ajouter un commentaire et/ou une note

Description

Je pense que le titre est clair !!
Cela permet le drag & drop sur un élément de la page en ajoutant uniquement cette fonction :
dragDrop.Add( "id de l'élément", "fonction après déplacement", clickGauche );

on peut aussi définir un élément pouvant servir de destination pour les déplacements !!

Lorsqu'un déplacement commence, l'élément concerné passe au premier plan ( mais, ça ne fonctionne pas avec certain éléments ?? )
 

Fichier Zip

Pour les "Membres Club", vous pouvez télécharger directement un fichier contenu dans le zip sans télécharger le zip en entier !

Télécharger le zip

Historique

20 août 2004 12:00:19 :
J'ai mieux géré la position de l'élément déplacé, par rapport au curseur !! J'ai également ajouté une méthode permettant d'indiquer à un élément qu'il peut servir de zone de placement (vous verrez bien dans l'exemple !! ) Et enfin, j'ai ajouté une méthode permettant d'annuler le dernier déplacement.
20 août 2004 12:20:39 :
Oooops !! J'avais juste oublié une image !! Et j'ai mis mon code dans la catégorie "Initié". Je pense qu'il le mérite !! Non ?
20 août 2004 15:27:39 :
Maintenant on peut définir le boutton permettant le déplacement (dans la méthode Add) J'ai également ajouté un lien à déplacer !!
15 décembre 2007 12:57:17 :
Ajout d'un teste permettant d'empêcher deux éléments de se positionner sur le même DropPoint... Le corp de la fonction appelée après un déplacement a changé function functionAfterDrop( idElement, idDropPoint ) { }

Commentaires et avis

signaler à un administrateur
Commentaire de flo_le_dino le 19/08/2004 17:10:01

ca c'est bien !
y'a un petit bug --> quand tu commence le drag, le curseur se positionne automatiquement dans le milieu de l'objet...Quand ils sont petits ca pose pas de problèmes mais s'ils étaient plus gros, ca serait le bordel!
je met 8, c'est simple mais tjs utile !

signaler à un administrateur
Commentaire de LUDINSKI le 20/08/2004 10:02:22

Merci mon gars !!

Pour le petit bug, je l'ai corrigé hier soir !! Maintenant, l'élément reste positionné par rapport au coordonnées du curseur lors du OnMouseDown ( c'est pas facile à expliquer !! ).

Là, je suis en train d'ajouter une méthode UNDO, pour repositionner l'élément à sa position initiale !!

Si tu as une idée sur une fonctionnalité à ajouter, fait moi signe !!

signaler à un administrateur
Commentaire de mymyss le 06/09/2004 23:24:45

Trés, trés beau code. Franchement le javascript en objet j'en vois pas tous les jours et ça fais plaisir.

Bonne continuation !

signaler à un administrateur
Commentaire de flashfun le 07/09/2004 14:27:40

Minuscule Bug:
Sous firfox, on peut selectionner le text "Déplacez-moi", et quand on déplace le caractère selectionné on peut placer la div où on veux.

signaler à un administrateur
Commentaire de LUDINSKI le 07/09/2004 18:26:07

Salut flashfun !!

merci, je l'ai remarqué, mais je n'ai pas trouvé comment le supprimer !!
J'y travail de temps en temps ...

signaler à un administrateur
Commentaire de Ricou13 le 09/01/2006 10:11:14

Heu...

Je voudrais pas faire l'oiseau de mauvaise augure mais...
Autant ça marche nickel sous FF, autant, il ne se passe rien sous IE6.

Est-ce normal ?

signaler à un administrateur
Commentaire de Ricou13 le 09/01/2006 12:45:36

J'ai trouvé ce qui n'allait pas :
Il n'y pas de META de charset dans l'exemple. De fait, pour une raison aussi obscure que le fonctionnement de IE, toutes les lignes Javascript précédées par un commentaire dont la dernière lettre est accentuée (ex "un élément est déplacé") étaient ignorées

Ainsi des lignes comme "this.fonctionsOnDrop = new Array;" étaient purement "zappées". Dans ces conditions ça ne risquait pas de fonctionner.

Il faut donc ajouter un charset, par exemple :

<meta http-equiv="content-type" content="text/html;charset=iso-8859-1" />

Je suis en train de faire quelques modifs pour l'adapter à ma sauce. Je les livrerais quand ça marchera. :)

signaler à un administrateur
Commentaire de stfou le 25/05/2006 20:41:45

bravo, je met 10, car ça le mérite, c'est pratique et facile a modifier

signaler à un administrateur
Commentaire de younes371 le 20/09/2006 18:32:53

Bonjour,  

Je travail sur un projet de fin d'étude ,oû je dois mettre des drag and drop, le meme que www.netvibes.com ou www.google.com/ig
Si vous pouvez m'aider et m'envoyer le script ça serait gentil de votre part .  
aussi je me suis inspiré de
http://tool-man.org/examples/sorting.html mais ça reste un peu flou.
Aussi j'aimerai bien faire la creation de nouvel onglet comme sur www.netvibes.com ' nouvel onglet ' . merci d avance les amis
Merci  

signaler à un administrateur
Commentaire de ekate le 28/07/2008 13:09:19

bonjour a tous,

Cela fait un moment que vous n'avez pas du vous interreser à ce code mais j'ai une question importante. après plusieurs tests, j'ai remarqué un problème a l'integration du code a mon site. Plus rien ne fonctionne et cela semble être lié au doctype que j'emploie.

quelq'un pourait-il me donner l'entete d'une des pages qui incorporent ce code ???

Merci beaucoup

signaler à un administrateur
Commentaire de chiktika le 03/12/2008 12:30:50

Bonjour,
je vois bien que le sujet date un peu mais je voudrais relancer le dernier message d' EKATE ; j'ai eu les mêmes problèmes et en farfouillant un peu j'ai trouvé ceci :

<< Théoriquement on doit pouvoir utiliser scrollLeft et scrollTop, mais je me suis rendu compte que la directive doctype en XHTML 1.0 Transitional rendait cette propriété inexploitable. Sans la directive cela fonctionne, les valeurs retournées sont correctes, mais avec le doctype les valeurs retournées sont systématiquement égales à 0. >>

Voila si quelqu'un peut faire avancer le problème.
Merci beaucoup.

Ajouter un commentaire

Discussions en rapport avec ce code source dans le forum

Déplacement d'un calque. [ par LocalStone ] Salut ! Et bien voilà, je cherche à deplacer un calque (DIV) sur l'écran (comme une simple fenetre) avec le curseur de la souris, mais je n'y arrive Problème de déplacement d'une image [ par chaloup ] Bonjour, voila je cherche a faire un jeu en java mais je n'arrive pas a faire qu'un objet ce déplace en fonction du temps suivant une fonctions mathém Tableau avec déplacement par les fleches et action si <RC> sur une ligne [ par abcxtreme ] Bonjour &#224; tous, Je suis tout juste d&#233;butant en PHP, javascript et je cherche un script (avec un exemple id&#233;alement) permettant de g&#23 Déplacement d'un calque [ par Tilix ] alut, j'ai trouv&#233; ce script, permettant d'affich&#233; un calque css quand la souris se trouve sur le lien Code : CSS &lt;!-- a Déplacement d'une image dans une boite [ par carteq ] J'ai construit un site de Web-Mapping (cartographie interactive). J'ai ajouté une fonction de "glisser-déplacer la carte". Le problème, c'est l'image Scrollbar et déplacement d'une image avec la souris [ par cepekinio ] Bonjour,Contexte : appli web J2EE (JSP/JVScript/java) .J'ai réaliser une sorte de visionneuse de document(au format jpg) et je viens d'implémenter une Déplacement aléatoire de plusieurs images [ par tales ] Bonjour,Je cherche un script qui me permette d'avoir un déplacement aléatoire de plusieurs images et chaque fois que les images changent de direction


Nos sponsors

Sondage...

CalendriCode

Juillet 2009
LMMJVSD
  12345
6789101112
13141516171819
20212223242526
2728293031  

Consulter la suite du CalendriCode

Comparez les prix Nouvelle version

Photothèque Nouveau !



Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés
Temps d'éxécution de la page : 0,608 sec

Google Coop CodeS-SourceS Google Coop CodeS-SourceS


Certaines images présentes sur le site (notament certains avatars) sont issues des collections IconShock, donc si vous souhaitez utiliser ces icons vous devez les acheter, ne les copiez pas et ne utilisez pas dans vos sites et applications sans les avoir commandé.