
Jetzt gibt es ein neues Plugin für Onlinegalerien bzw. Portfolio-Darstellungen: jQuery Stapel
Das Modul gruppiert Thumbnails zu einem Stapel übereinander, die bei Klick wieder nebeneinander als Gatter ausgebreitet werden. Das Stapel-Modul ist flexibel in der Anordnung, passt sich auch der Fensterbreite an (responsive layout).
Als Technik unter der Haube werden CSS-Transforms und Transitions verwendet. Für ältere Browser die das nicht unterstützen wird einfach jQuery Animate verwendet :-)
Uns so wirds verwendet: Eine Liste mit der Klasse tp-grid
<ul id="tp-grid" class="tp-grid"> <li data-pile="Group 1"> <a href="#"> <span class="tp-info"> <span>Some title</span> </span> <img src="images/1.jpg" /> </a> </li> <li data-pile="Group 2"> ... </li> <li data-pile="Group 1,Group 2"> .... </li> </ul>
Der jQuery-Aufruf erfolgt durch:
$( '#tp-grid' ).stapel();