2010-10-04 10 views
5

Ich habe eine Website, an der ich arbeite, die ein paar absolut positionierte divs hat, die ich beim Klicken skalieren muss, diese füllen dann den Container, in dem sich die divs befinden. Die Frage ist Wie kann ich sie aktivieren, um zur ursprünglichen Position (oben, links) zurückzukehren, die für jeden unterschiedlich ist.jQuery animiert zurück zur ursprünglichen Position

$(".work-item .toggle").toggle(function() { 
     $(this).parent().animate({ height: '430', width: '930', top: '0', left: '0' }, 750); 
    }, 
    function() { 
     var pos   = $(this).parent(); 
     var position = pos.position();  

     $(this).parent().animate({ height: '150', width: '200', top: position.top, left: position.left }, 750); 
    }); 

Versucht das oben genannte aber es erhält die neue Position nicht das Original.

Vielen Dank im Voraus.

PVS

Antwort

12

Sie die Position speichern kann, wenn die Seite geladen wird $.data() verwenden und es später verwenden, wie folgt aus:

$(".work-item .toggle").each(function() { 
    $.data(this, 'position', $(this).parent().position()); 
}).toggle(function() { 
    $(this).parent().animate({ height: '430', width: '930', top: '0', left: '0' }, 750); 
}, function() { 
    var position = $.data(this, 'position'); 
    $(this).parent().animate({ height: '150', width: '200', top: position.top, left: position.left }, 750); 
}); 

Das die .position() für jedes Element des Mutter speichert, kurz bevor Sie binden, dann verwendet das, wenn später animiert wird.

+0

Danke Nick! Funktioniert gut. –

Verwandte Themen