Discussion :

[diablo62]

Bonjour

J ai un petit soucis je voudrais faire du drag avec jquery mais le soucis c'est qu'il renvoie des values absolutes. Je voudrais savoir si c'est possible de lui faire retourner des valeurs par rapport a son div parent et de le contraindre dedans ?

Voici mon code

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
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
 
 
<script src="js/jquery-1.3.2.min.js"></script>
<script src="js/jquery-ui-1.7.2.custom.min.js"></script>
<script src="js/ui.core.js"></script>
<script src="js/ui.draggable.js"></script>
<script type="text/javascript"> 
 
  $(function() {
 
 
	$(".draggable").draggable(
 
    {
	 grid: [15, 15],
      drag: function(event, ui) {
 
        $(".draggable").css("opacity", "0.6"); // Semi-transparent when dragging
 
      },
 
      stop: function(event, ui) {
 
        saveCoords(ui.absolutePosition.left, ui.absolutePosition.top, ui.helper.attr('id'));
 
        $(".draggable").css("opacity", "1.0"); // Full opacity when stopped
 
      },
 
      cursor: "move"
 
    });
 
  });
 
  function saveCoords(x, y, el) {
 
	request('POST','includes/save_coords_pc.inc.php','coords=ok&id='+ el + '&x='+ x + '&y=' + y,'ajax_content');
 
}
 
 
</script> 
 <STYLE type=text/css>
	.draggable { width: 150px; height: 150px; padding: 0.5em; border:dashed #333333; }
	.demo { width:750px; height:450px; border:dashed #000; };
</STYLE>  
 
 
<DIV class=demo>
    <DIV class=draggable id="1">
        <P>Drag me around</P>
    </DIV>
    <DIV class=draggable id="2">
        <P>Drag me around</P>
    </DIV>
    <DIV class=draggable id="3">
        <P>Drag me around</P>
    </DIV>
</DIV>

J'ai vu du ui.helper ou constraint mais je vois pas comment les implenter dans mon script donc si qq un peut m'aider ce serait sympa

[BkD35]

Je n'ai pas très bien saisi ta question, mais néanmoins est-ce que tu as lu la documentation du plugin draggable sur jquery.com ?

http://jqueryui.com/demos/draggable/

Si tu regarde la partie option ainsi que les démos sur la droite, tu verras que tu peux contraindre un élément draggable à rester dans un certain conteneur.

[diablo62]

merci
je l'ai lu mais je comprends pas comment rajouter cette contrainte dans le code que j'ai déjà.

[diablo62]

finalement je viens de comprendre ou il fallait le mettre j'avais pas vu le lien qui permet d'afficher le code source sur le site de jquery et je comprenais pas la doc en anglais

Merci d'avoir répondu

[BkD35]

De rien le principal étant que ton problème est résolu ^^

Peux tu passer ce sujet en résolu (en bas à gauche de la page)