pixelate image
manipuleer de pixels van een afbeelding

home | index | menu | help

Er is geen CSS ondersteuning.

		
		

IE probeert er ook iets van te maken. Als je met jouw muis even over het plaatje "gaat" (en je gebruikt IE als browser) zie je dat er een poging wordt gedaan om de pixels iets te manipuleren. Heb je een moderne browser dan zie je hoe je de pixels een beetje krachtiger kan manipuleren. Ik heb alleen (in dit voorbeeld) de groene pixels een random-waarde gegeven. Maar je kan alles met de pixel-waarden uithalen wat je maar wilt. Na de regel:

for (var i=0,n=pix.length;i<n;i += 4){

kan je de pixel-waarden veranderen. Ik zou zeggen: Kopieer de broncode van de pixelate-image procedure en kijk wat voor effecten je kan bereiken. In dit voorbeeld wordt er een hover getriggerd; maar je kan natuurlijk ook deze procedure in transitions o.i.d. gebruiken. De procedure is valide html5, en ook JSLint heeft geen klachten.

cache 23-08-2010