Crescere dal centro di animazione con JQuery

Question

Sto cercando di avere un div popup da un pulsante. Quando si fa clic sul pulsante, voglio che il popup cresca verso l'esterno dal centro del pulsante e, allo stesso tempo, scorri verso il centro dello schermo. Non penso che questo dovrebbe essere troppo difficile ma non riesco a trovare alcun frammento ovunque. Qualsiasi aiuto sarebbe molto apprezzato.

Grazie all'aiuto di Jamie Dixon, ho ottenuto il funzionamento di questo codice.

$('#grower').css({ 
    backgroundColor: '#FFFFFF', 
    border: '10px solid #999', 
    height: '0px', 
    width: '0px', 
    color: '#111111', 
    fontWeight: 'bold', 
    padding: '10px', 
    display: 'none', 
    position: 'absolute', 
    left: $(this).position().left, 
    top: $(this).position().top 
}).appendTo('#overlay').fadeIn(0).animate({ 
    position: 'absolute', 
    height: '200px', 
    width: '600px', 
    marginTop: '-120px', 
    marginLeft: '-320px', 
    display: "", 
    top: ((($(parent).height() - $(this).outerHeight())/2) + $(parent).scrollTop() + "px"), 
    left: ((($(parent).width() - $(this).outerWidth())/2) + $(parent).scrollLeft() + "px") 
}, 1000); 

Answer 1

È possibile utilizzare l'interfaccia utente di jQuery con il metodo show che passa in "scala" come parametro.

$('#growwer').show("scale",{}, 1000); 

Working example

a scivolare il vostro elemento al centro o alla pagina che ho creato una versione modificata della funzione Tony L's jQuery trovato qui: Using jQuery to center a DIV on the screen.

Working Example

Aggiornamento

Ecco un esempio di lavoro dei due animazioni in esecuzione simultaniously:

http://jsfiddle.net/wNXLY/1/

Per arrivare a questo lavoro ho inserito un parametro aggiuntivo sulla funzione animate passaggio: {duration: durationLength, queue: false}