2013-05-16 27 views
5

sono occupato con uno script di orario, per questo ho bisogno di usare jQuery trascinabile e ridimensionabile. ma si può vedere in te jsFiddle che il trascinabile ha un genitore, ma puoi trascinarlo di 10px sul genitore, ogni momento di scatto. MODIFICA: la cosa di cui ho bisogno è che non può essere trascinato fuori dal container. che può aiutareIl div trascinabile e ridimensionabile con contenimento esce dal contenimento

http://jsfiddle.net/QBX2B/1/

html:

 <div class="containment" style="display:block; height:40px; width:150px; background-color:#f2f2f2;"> 
     <div class="baldie" style="display:block; height:40px; width:150px; background-color: rgba(214, 255, 210, .7);"/> 
    </div> 

jquery:

   $('.baldie').resizable({ 
         containment: "parent", 

        }).draggable({ 
         grid: [5,0], 
         containment:"parent", 
         drag: function(event, ui) { 

         } 
        }); 
+1

Quello che vuoi esattamente definire correttamente? –

+0

vuoi che il div di 'baldie' venga trascinato al di fuori del div del genitore? – Sreekumar

+1

no non può uscire fuori bladie ma in questo momento è possibile su chrome – user2389793

risposta

3

Aggiunta di un position:relative; al contenitore risolve il problema.

ho modificato il codice di controllo corsa e si può controllare: -

<div class="containment" style="position: relative; display:block; height:40px; width:150px; background-color:#f2f2f2;"> 
      <div class="baldie" style="display:block; height:40px; width:150px; background-color: rgba(214, 255, 210, .7);"/> 
     </div> 

lo controlla: -

Jquery UI resizable issue expands beyond containment (draggable also used)

+2

Non risolve il problema usando il chrome –

+0

sì ho avuto il problema con chrome – user2389793

+0

@Learner Anche usando jsfiddle dal link che hai postato, sono ancora in grado per trascinare il dragabble all'esterno del contenimento –

0

linea styling non è buona pratica. Risulta in codice disordinato ea volte difficile da leggere. Usando i CSS per modificare il margine e il padding del genitore possiamo permettere al bambino di coprire l'intero genitore. JSFiddle Solution

.baldie{ 
    display:block; 
    height:40px; 
    width:150px; 
    background-color: rgba(214, 255, 210, .7); 
    margin:1px; 
} 
.containment{ 
    position:relative; 
    display:block; 
    height:40px; 
    width:150px; 
    background-color:#f2f2f2; 
} 
+0

thanls ma non risolve il problema – user2389793

+0

Come @ user2389793, posso ancora trascinare l'elemento al di fuori del contenimento di pochi pixel ogni volta utilizzando chrome win7 –

+0

è necessario fare clic e trascinare sul lato destro se si fa questo più volte va 10px a destra ogni clic – user2389793

Problemi correlati