Bonjour,

j'étudie actuellement le moyen de mettre des fonctionnalités de drag and drop sur une application web et j'aurai aimé échanger à ce sujet. J'ai suivi quelques tutoriels, parcouru quelques forums (dont celui de developpez.com), mais je n'arrive pas à voir si c'est moi qui ai omis quelque chose où c'est Firefox 5.0 qui a un petit soucis.

Mon soucis étant que le résultat de ce code, ne fournit pas le résultat attendu :

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
<html>
	<head>
		<title>Draggable tags</title>
		<style type="text/css"></style>
		<script type="text/javascript">                         
                        function handleDragStart(e) {
                          // alert('you drag');
                          this.style.opacity = '0.4';  // this / e.target is the source node.
                          //return true;
                        }
                        </script>
	</head>
<body>
 
<a href="#">no draggable</a><br/>
<a href="#" draggable="true" ondragstart="handleDragStart(event)">draggable true</a><br/>
<a href="#" draggable="false">draggable false</a><br/>
 
<ul>
	<li>liste no draggable</li>
	<li draggable="true" ondragstart="handleDragStart(event)">liste draggable true</li>
	<li draggable="false">liste draggable false</li>
</ul>
 
<div id="columns">
  <div class="column"><header>no draggable</header></div>
  <div class="column" draggable="true" ondragstart="handleDragStart(event)"><header>draggable true 1</header></div>
  <div class="column" draggable="true" ondragstart="handleDragStart(event)"><header>draggable true 2</header></div>
  <div class="column" draggable="false"><header>draggable false</header></div>
</div>
 
</body>
</html>
Je m'attendais à voir le ghost de l'élément déplacé, pour indiquer que l'élément est bien en cours de déplacement, mais rien...

- avec IE 7 : ça marche pas, mais il semble que des scripts existent
- avec Chrome 12.0.742.122 : pas de soucis, appel de la fonction
- avec Firefox 5.0 : appel de la fonction, mais problème ci dessus

Du coup je partage mes quelques liens à ce sujet :
http://www.whatwg.org/specs/web-apps...e/dnd.html#dnd
http://html5doctor.com/native-drag-and-drop/
http://www.tutorialspoint.com/html5/html5_drag_drop.htm
http://www.html5rocks.com/en/tutorials/dnd/basics/

Bonne journée

PS : j'espère être au bon endroit pour poster.