24 ožujka, 2011

3D efekti na web stranicama

3D efekti na web stranicama

Novi projekt od Mark Beasleyja pretvara 2D slike na web stranici u stereoskopske slike koje se pojavljuju tro-dimenzionalno kada ih gledate kroz crveno-plave naočale.



Posjetite neku web stranicu koja sadrži mnogo slika npr. Google Images, i u adresnoj traci zaljepite ovu Javascriptu:

javascript:(function(){%20%20%20%20var%20proxy_data_url%20%3D%20%27http%3A//duskjacket.com/333DDD/pRoXy/%27%3B%20%20%20%20%20otherlib%3Dfalse%3B%20%20%20%20function%20getScript%28url%2Csuccess%29%7B%20%20%20%20%20%20var%20script%3Ddocument.createElement%28%27script%27%29%3B%20%20%20%20%20%20script.src%3Durl%3B%20%20%20%20%20%20var%20head%3Ddocument.getElementsByTagName%28%27head%27%29%5B0%5D%2C%20%20%20%20%20%20%20%20done%3Dfalse%3B%20%20%20%20%20%20%20%20script.onload%3Dscript.onreadystatechange%20%3D%20function%28%29%7B%20%20%20%20%20%20%20if%20%28%20%21done%20%26%26%20%28%21this.readyState%20%20%20%20%20%20%20%20%20%7C%7C%20this.readyState%20%3D%3D%20%27loaded%27%20%20%20%20%20%20%20%20%20%7C%7C%20this.readyState%20%3D%3D%20%27complete%27%29%20%29%20%7B%20%20%20%20%20%20%20%20done%3Dtrue%3B%20%20%20%20%20%20%20%20success%28%29%3B%20%20%20%20%20%20%20%20script.onload%20%3D%20script.onreadystatechange%20%3D%20null%3B%20%20%20%20%20%20%20%20head.removeChild%28script%29%3B%20%20%20%20%20%20%20%7D%20%20%20%20%20%20%7D%3B%20%20%20%20%20%20head.appendChild%28script%29%3B%20%20%20%20%20%7D%20%20%20%20%20getScript%28%27http%3A//ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js%27%2Cfunction%28%29%20%7B%20%20%20%20%20%20%20%20var%20times%20%3D%200%3B%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20showMsg%28%29%3B%20%20%20%20%20%20%20%20var%20inter%20%3D%20setInterval%28function%20%28%29%7B%20%20%20%20%20%20%20%20%20%20%20%20%20showMsg%28%29%3B%20%20%20%20%20%20%20%20%20%20%20%20%20times++%3B%20%20%20%20%20%20%20%20%20%20%20%20%20if%28times%20%3D%3D%205%29%20clearInterval%28inter%29%3B%20%20%20%20%20%20%20%20%7D%2C2000%29%3B%20%20%20%20%20%20%20%20%20return%20true%3B%20%20%20%20%20%7D%29%3B%20%20%20%20%20function%20showMsg%28%29%20%7B%20%20%20%20%20%20%20%20%20%20%20if%20%28otherlib%29%20%7B%20%20%20%20%20%20%20%20%20%20%20%20%20%24jq%3DjQuery.noConflict%28%29%3B%20%20%20%20%20%20%20%20%20%20%20%7D%20%20%20%20%20%20%20%20function%20make%28canvas%2Cimg%29%20%7B%20%20%20%20%20%20%20%20var%20w%20%3D%20img.width%28%29%3B%20%20%20%20%20%20%20%20var%20h%20%3D%20img.height%28%29%3B%20%20%20%20%20%20%20%20var%20image%20%3D%20img%5B0%5D%3B%20%20%20%20%20%20%20%20var%20cvs%20%3D%20canvas%5B0%5D%3B%20%20%20%20%20%20%20%20cvs.width%20%3D%20w%3B%20%20%20%20%20%20%20%20cvs.height%20%3D%20h%3B%20%20%20%20%20%20%20%20var%20ctx%20%3D%20cvs.getContext%28%272d%27%29%3B%20%20%20%20%20%20%20%20ctx.drawImage%28image%2C%200%2C%200%2C%20w%2C%20h%29%3B%20%20%20%20%20%20%20%20var%20data%20%3D%20ctx.getImageData%280%2C0%2C%20w%2C%20h%29%3B%20%20%20%20%20%20%20%20var%20dataLeft%20%3D%20ctx.getImageData%280%2C0%2C%20w%2C%20h%29%3B%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20xoffset%20%3D%202%3B%20yoffset%20%3D%204%3B%20%20%20%20%20%20%20%20for%20%28var%20i%3D%28w*yoffset%29%2Cl%3DdataLeft.data.length/4%3B%20i%3Cl%3B%20i++%29%20%7B%20%20%20%20%20%20%20%20%20%20%20%20%20if%28i%25w%20%3E%201%29%7B%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20data.data%5Bi%20*%204%5D%20%3D%20dataLeft.data%5B%20%28i%20*%204%20-%20%28xoffset*4%29%29%20-%20%28w*yoffset*4%29%5D%3B%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%20%20%20%20%20%20%20%20%7D%20%20%20%20%20%20%20%20ctx.putImageData%28data%2C%200%2C%200%29%3B%20%20%20%20%7D%20%20%20%20function%20remote_host%28url%29%7B%20%20%20%20%20%20%20%20if%28url%21%3Dnull%20%26%26%20url%21%3Dwindow.location.hostname%20%26%26%20url.indexOf%28%27http%27%29%3D%3D0%29return%20true%3B%20%20%20%20%20%20%20%20else%20return%20false%3B%20%20%20%20%7D%20%20%20%20%24%28%27body%27%29.find%28%27img%27%29.each%28function%20%28indexInArray%29%7B%20%20%20%20%20%20%20%20var%20img%20%3D%20%24%28this%29%3B%20%20%20%20%20%20%20%20if%28remote_host%28img.attr%28%27src%27%29%29%29%7B%20%20%20%20%20%20%20%20%20%20%20%20%24.ajax%28%7B%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20url%3A%20proxy_data_url%2C%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20type%3A%20%27GET%27%2C%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20dataType%3A%20%27jsonp%27%2C%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20data%3A%20%7Burls%3Aimg.attr%28%27src%27%29%7D%2C%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20async%3A%20false%2C%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20success%3A%20function%20%28data%29%7B%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%28data.length%20%3D%3D%200%29%20return%20false%3B%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20var%20newImg%20%3D%20%24%28%27%3Cimg%3E%27%29.attr%28%27src%27%2Cdata%5B0%5D%29%3B%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20var%20ctx%20%3D%20%24%28%22%3Ccanvas%3E%3C/canvas%3E%22%29%3B%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%28img.width%28%29%20%3C%3D%200%20%7C%7C%20img.height%28%29%20%3C%3D%200%29%20return%20true%3B%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20newImg.width%28img.width%28%29%29%3B%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20newImg.height%28img.height%28%29%29%3B%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20make%28ctx%2CnewImg%29%3B%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20img.replaceWith%28ctx.get%28%29%5B0%5D%29%3B%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%7D%29%3B%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7Delse%7B%20%20%20%20%20%20%20%20%20%20%20%20var%20ctx%20%3D%20%24%28%22%3Ccanvas%3E%3C/canvas%3E%22%29%3B%20%20%20%20%20%20%20%20%20%20%20%20if%28img.width%28%29%20%3C%3D%200%20%7C%7C%20img.height%28%29%20%3C%3D%200%29%20return%20true%3B%20%20%20%20%20%20%20%20%20%20%20%20make%28ctx%2Cimg%29%3B%20%20%20%20%20%20%20%20%20%20%20%20img.replaceWith%28ctx.get%28%29%5B0%5D%29%3B%20%20%20%20%20%20%20%20%20%20%20%7D%20%20%20%20%7D%29%3B%20%20%20%20%7D})();

Oznake

3D (53) ADOBE (35) ALEXA (4) ANDROID (135) ANIMACIJE (36) ANTISPAM (7) ANTIVIRUS (126) APPLE (108) ARCHLINUX (6) AUDIO (62) AVATARI (7) BACKUP (26) BESPLATNO (1298) BING (11) BLACKBERRY (44) BLOGGER (36) BLU-RAY (7) BLUETOOTH (10) CD (25) CENTOS (5) CHAT (74) CHROME (83) CHROME-OS (10) CSS (12) DEBIAN (21) DIGG (6) DOWNLOAD (1177) DREAMWEAVER (5) DRIVERS (6) DVD (37) E-CARDS (23) E-KNJIGE (33) FACEBOOK (106) FAVICON (8) FEDORA (23) FILMOVI (53) FIREFOX (137) FIREWALL (7) FLASH (38) FLICKR (33) FONTOVI (21) FOTOAPARATI (9) FOTOGRAFIJA (9) GENTOO (3) GIMP (19) GLAZBA (1) GMAIL (161) GOOGLE (311) GPS (2) HACK (16) HRVATSKI (47) HTML (16) IEXPLORER (52) IGRE (131) IKONE (23) INSTAGRAM (3) INTERNET (792) IPAD (137) IPHONE (263) IPOD (170) JAVA (12) JAVASCRIPT (5) KAMERE (5) KODOVI (27) KOMPJUTERI (7) LAPTOPI (36) LINUX (412) MAC (205) MANDRIVA (8) MICROSOFT OFFICE (57) MOBITELI (376) MONITORI (7) MP3 (71) NEXUS-ONE (10) NEXUS-S (7) NINTENDO (7) NOKIA (49) OPENOFFICE (13) OPENSUSE (12) OPERA (44) ORKUT (12) PCLINUXOS (7) PHOTOSHOP (16) PICASA (20) PLAYSTATION (9) POZADINE (52) PRINTERI (9) PROGRAMI (1059) RAPIDSHARE (4) REDHAT (6) SCREENSAVERS (13) SEO (6) SKYPE (25) SLACKWARE (5) SLIKE (251) SMAJLICI (19) SONY-PSP (6) SUSE (3) TABLETI (2) TECHNORATI (3) THEMES (38) TITLOVI (6) TORRENT (5) TRIKOVI (50) TRIKOVI-SAVJETI (104) TV (25) TWITTER (46) UBUNTU (289) USB (95) VIDEO (217) VIRUSI (13) VLC-PLAYER (18) WINDOWS (811) WORDPRESS (29) XBOX (4) XBOX360 (6) YAHOO (45) YOUTUBE (138)