2012-02-23 29 views
12

Come posso eseguire l'animazione dalla posizione corrente al centro utilizzando position({of:,my:,at:})? C'è un modo per automatizzare il processo, o devo animare manualmente le proprietà CSS?animare la posizione di jQuery Ui()

+0

vedere la funzione http://api.jquery.com/animate/, è possibile specificare un insieme di valori CSS e jQuery farà la transizione. – Yogu

risposta

1

Hai guardato .animate()?

Modifica: Ora che ho capito cosa stai cercando un po 'meglio, here is a jQuery plugin that I wrote to do this very thing.

Here's a quick jsFiddle as an example.

Ho reso le opzioni un oggetto configurabile. Esempio:

$('#clickme').click(function() { 
    $('#blah').align({speed:1000,y:false}); 
});​ 

EDIT: togliere l'altro codice in quanto non è più necessario e solo cose ingombra. Pulire il mio nuovo codice. Risolti i problemi di posizionamento parent offset. Aggiunto un link al repository git e jsFiddle usando l'ultima versione del sorgente.

+0

Lo so, ma poi dovrò calcolare la divisione larghezza-altezza del div per 2, ecc. Mi chiedevo se esistesse un modo per animare, diciamo: position ({of:, my:, at: , animate: slide}), o qualcosa del genere. – localhost

+0

jsfiddle.net/MjsDc/8/ Questo lo risolverebbe, ma è un po 'disordinato. Volevo che una soluzione andasse con position ({of:, my:, at:}). – localhost

+0

@ localhost2 OK ... Ho scritto codice per questo in realtà .... era un'estensione jQuery centrata su oggetti che ho usato su un sito client ... devo vedere se riesco a scavare ... –

24

Questa risposta potrebbe essere già tornata in febbraio, ma ora c'è un modo molto più semplice.

Il metodo posizione accetta un argomento using solo per questo scopo. Per esempio:

$(div).position({ 
    at: "left+50% top+50%", 
    of: $(div).parent(), 
    using: function(css, calc) { 
     $(this).animate(css, 200, "linear"); 
    } 
}); 
+0

Buono a sapersi, grazie. – localhost

Problemi correlati