flip images
images-flips cross browser

home | index | menu | help

Er is geen CSS ondersteuning.


		

 


		

Tot oktober 2010 hebben we braaf de gammele IE6, en nog rottere versies van Microsoft-browsers, geduldig ondersteund. Heel veel website-bouwers hebben hun pagina's verminkt en (zwaar) vertraagd om de "rommel" aan de praat te houden. Nu IE9 voor de deur staat, is het wel genoeg geweest. Als een paar bezoekers met museum-stuk-browsers willen surfen is dat natuurlijk hun goed recht. Maar dan hebben wij (website-bouwers) ook het volste recht om ze dan maar lekker hun eigen broek op te laten halen... Kindermeisje spelen = voorbij !!

Nu die zorg van ons afgevallen is, maken we ons er dus niet meer druk over dat IE6 niet zo lekker "hovert". Om een plaatje (cross-browser) een horizontale of verticale flip te geven is een fluitje van een cent. Geef een image de class "horizontaal" of "verticaal" en plaats het onderstaande stukje style-sheet in de head van de pagina. Als je met de muis over de plaatjes gaat is het effect geheel duidelijk.

<style type="text/css" media="screen">
	.horizontaal:hover{
		-moz-transform:scaleX(-1);
		-webkit-transform:scaleX(-1);
		-o-transform:scaleX(-1);
		transform:scaleX(-1);
		filter:fliph}
	.verticaal:hover {
		-moz-transform:scaleY(-1);
		-webkit-transform:scaleY(-1);
		-o-transform:scaleY(-1);
		transform:scaleY(-1);
		filter:flipv}
</style>
		

cache 17-10-2010