Effect wie auf dieser Webseite

[pepesan]

Hallo

ich habe eine Menü erstellt was wie ein Schachbrett aussieht.
Also 1 Kästchen (div) animiert das andere nicht. Dann wieder eins usw.

Als Animation würde gerne sowas machen wie auf dieser Webseite die unteren vier rechten Kästchen.

Home

Kann mir jemand ein Beispiel Code geben mit dem sich sowas realisieren lässt.
Ich habe schon rausgefunden das es die diverseste Flip JQuery Plugins gibt.
Keins aber erfüllt das was ich möchte oder ich bin zu blöd dazu.

Vielen Dank schon mal.

 

[threadi]

Ich würde sagen dafür ist auf dieser Seite dieser Code zuständig:

$B(document).ready(function(){
		$B('#btcontentshowcase114 .metro-slider').metroslide({
			mode: 'flip',
			direction: 'ttb',
			autoplay: 'false', 
			interval : 5000,
			speed: 1000 , 
			pauseOnHover: true , 
			animateOnHover: true,
			preloadImages: true, // preload images
			visible: 0, //number of item per slide which you can be see
			itemWidth: 247, //specify width of item
			itemHeight: 120, //specify height of item
		});
	});

Stichwort wäre also "metroslide".

 

[Sempervivum]

Skripts für solche Flip-Effekte gibt es einige. Hier ist eine Übersicht:
Image Flip Illusion Using jQuery

 

[pepesan]

Danke schonmal
Wo bekomme ich denn diesen Metroslide her?
Habe alles abgesucht und nicht gefunden.

Gruss

 

[threadi]

Ich würde sagen, dass hat jemand extra für diese Seite dort so geschrieben. Sempervivum hat dir aber bereits Alternativen gezeigt, die man per CSS sicher auch exakt an dieses Verhalten anpassen kann.

 

[Matze27]

Hallo,
eine Möglichkeit, Elemente zu animieren, besteht über die Eigenschaft -web-kit-transform.
Hier eine Seite, die viele der Möglichkeiten aufzeigt und verdeutlicht.
Animation Using CSS Transforms < CSS | The Art of Web

Gruß Matze