Discussion :

[Hotgeart]

Bonjour,

Je cherche a faire un drag d'une carte un peu comme Google map.

Cependant, quand ma div est plus grande que son parent ça bug.

Bug : http://jsfiddle.net/vM33R/

Work : http://jsfiddle.net/zjQnp/

Comme vous le voyez pour le premier il saute et pour le deuxième je n'ai aucun soucis. Et si vous retirez le "containment: ".map"" du premier ça marche, mais le drag n'a pas de limite.

Avez-vous une idée ?

Merci

[SpaceFrog]

as tu vu ce post là ?

http://www.developpez.net/forums/d10...e-google-maps/

[Hotgeart]

Non je n'avais pas vu merci. Ça me servira peut être en dernier recours.

Mais j'aimerai si possible y arriver avec draggable();.

Donc si quelqu'un a une idée.

Merci

[SpaceFrog]

draggable possède un argument "containment:"

[Hotgeart]

Oui j'utilise containment, mais comme tu le vois dans le Fiddle ça saute de coin en coin et je ne peux pas drag aisément

[SpaceFrog]

http://jsfiddle.net/vM33R/1/

reste à fixer les limites du deplacement

[Hotgeart]

Ça aussi c'était dans mon premier post.

_________________
J'ai trouvé la solution.

Pour ceux que ça intéresse :

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
 
$(function() {
    var ox     = $(".map").parent().offset().left;
    var oy     = $(".map").parent().offset().top;
 
    // combien de x PX à le border du parent?
    var border = 1;
 
    //drag
    $(".map").draggable({
        containment: [
            -($('.map').width()-$('.map-container').width()-border) + ox,
            -($('.map').height()-$('.map-container').height()-border) +oy,
            ox,
            oy
        ],
        scroll: false
    });
});

[SpaceFrog]

Merci d'avoir partagé la solution

mise en application http://jsfiddle.net/vM33R/2/