Bonjour à tous,

Voici mon problème.

Je souhaiterais rendre une DIV déplaçable dans ma page Web.
Pour ce faire je me suis orienté vers le html5.

J'arrive à avoir une solution fonctionnelle pour Chrome et Firefox, mais pas IE9.

Voici mon exemple de problème:

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
34
<!DOCTYPE html>
<html>
<head>
  <script src="http://code.jquery.com/jquery-latest.min.js"  type="text/javascript"></script>
</head>
<body>
 
	<div id="mydiv" draggable="true" style="border: Solid 1px Black; width: 150px; height: 150px"></div>
 
	<script type='text/javascript'>//<![CDATA[ 
                $(window).load(function(){
                $('#mydiv')
            .bind('selectstart', function(e) {
                // Prevent text selection
                return false;
            })
            .bind('dragstart', function(e) {
                e.originalEvent.dataTransfer.setData("Text", $(e.target).closest('div').attr('id'));
                console.log('dragstart');
            })
            .bind('drag', function(e) {
                console.log('drag');
            })
            .bind('dragend', function(e) {
                console.log('dragend');
            })
            .bind('click', function(e) {
                return false;
            });
        });//]]>  
 
        </script>
</body>
</html>


Merci de votre aide.

Martial.