begin process at 2010 02 10 07:21:58
  Trouver un code source :
 
dans
 
Accueil > 

Code

 > 

Effets

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

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


 Information sur la source

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

  • 1

  • 2

  • 3

  • 4

  • 5

  • 6

  • 7

  • 8

  • 9

  • 10
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 592 / 1 621

Auteur : LUDINSKI

Ecrire un message privé
Commentaire sur cette source (15)
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

Les Membres Club peuvent 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 ) { }

 Sources du même auteur

Source avec Zip Source avec une capture MENU VERTICAL D'UNE PAGE DHTML, GENERE DYNAMIQUEMENT, UTILIS...
Source avec Zip Source avec une capture UN TOOL TIP (BULLE D'AIDE) COMPATIBLE IE ET MOZILLA, MODIFIA...
Source avec Zip Source avec une capture UNE TREEVIEW GÉNÉRÉE DYNAMIQUEMENT, UTILISANT LES STYLES CSS...
Source avec Zip Source avec une capture MENU CONTEXTUEL EN CASCADE GÉNÉRÉ DYNAMIQUEMENT, UTILISANT L...

 Sources de la même categorie

Source avec Zip MOOTOOLTIP par Miky76
Source avec Zip Source avec une capture PAINTPIX (VERSION TESTE. EXPORTATION IMAGE POUR SITE WEB) par sitajony
FONCTION BLINK ( TESTÉE SOUS FF ) PORTABILITÉ IE OP ET GC EN... par xloadx
Source avec Zip Source avec une capture [DSI] DÉPLACEMENTS SUR IMAGES par Bul3
Source avec Zip Source avec une capture [ZI] ZOOM (LOUPE) SUR IMAGE par Bul3

 Sources en rapport avec celle ci

Source avec Zip Source avec une capture DIV TOTALEMENT AUTOMATIQUE VERTICAL AVEC PLEIN DE COMMANDES... par abdelaziz_info
Source avec Zip Source avec une capture DKSDRAGDROP : UNE BIBLIOTHÈQUE DE DRAG AND DROP ET DE GESTIO... par DARKSIDIOUS
LIBRAIRIE DE DRAG AND DROP par mickaelpfr
Source avec Zip PROTOTYPE DE DRAG'N DROP par FasteX_

Commentaires et avis

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 !

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 !!

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 !

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.

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 ...

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 ?

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. :)

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

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  

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

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.

Commentaire de subderground le 23/09/2009 12:37:42

Bonjour,

Super script :o) Facile  à mettre en page :o))
Comment faire pour que chaque objet déplaçable n'aie qu'une destination correcte pour un quizz ?
Merci.

Commentaire de LUDINSKI le 24/09/2009 19:41:16

Salut SubderGround !
Pour ce faire...

Prend 3 éléments dont un qui est le bon choix :
Réponse_1 // mauvaise réponse
Réponse_2 // mauvaise réponse
Réponse_3 // bonne réponse

Ensuite un drop point :
DropPoint_1


Puis tu affectes les rôles :
dragDrop.Add( "Réponse_1", "mauvaiseReponse" );
dragDrop.Add( "Réponse_2", "mauvaiseReponse" );
dragDrop.Add( "Réponse_3", "bonneReponse" );


et les fonctions :

function mauvaiseReponse( idDropPoint )
{
    if( idDropPoint != null )
    {
        // comptabiliser la mauvaise réponse...
    }
    else
        dragDrop.UndoMove();
}

function bonneReponse( idDropPoint )
{
    if( idDropPoint != null )
    {
        // bonne réponse... passer à la prochaine ^^
    }
    else
        dragDrop.UndoMove();
}

Commentaire de LUDINSKI le 24/09/2009 19:43:51

Par contre, si l'utilisateur affiche la source de la page...
il va facilement trouver les bonnes réponses !!

Va falloir ruser, en mettant le code js dans un fichier à part par exemple ^^

Commentaire de subderground le 26/09/2009 08:49:54

Ok merci beaucoup, je vais voir cela.

Pour l'affichage de la source, ce n'est pas grave.
Dans la version en cours, il y a même la possibilité d'afficher la réponse pour une auto-correction.

Avec vos infos, je devrais bien m'en sortir maintenant :o)

@+

 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...

Comparez les prix

CalendriCode

Février 2010
LMMJVSD
1234567
891011121314
15161718192021
22232425262728

Consulter la suite du CalendriCode

 
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

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 0,858 sec (4)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales