26.03.2010, 09:08 | |||||
Матричный эффектЭффект, как в фильме "Матрица". В head вставляем это:
Code <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Js Matrix by Aleko</title> <style> html,body {height:100%;} body {color:#009900;font-family:Lucida Sans Unicode;font-size:13px;margin:0;} img {border:none;outline:none;} .point {color:#60cccc;} #wrapper{height:500px;width:400px;background:black;position:relative;} .line {height:auto;height:100%;min-height:100%;overflow:hidden;position:absolute;width:12px;} </style> В body - это: Code <div id="wrapper"></div> <input type="button" value="Матричные" onclick="start(1)"/> <input type="button" value="Русские" onclick="start(3)"/> <input type="button" value="Английские" onclick="start(2)"/> <input type="button" value="Двоичная" onclick="start(5)"/> <input type="button" value="XO" onclick="start(4)"/> <script> i = new Array(); div = new Array(); headDiv = new Array(); showTimer = new Array(); a = new Array(); b = new Array(); c = new Array(); var param; function start(x){ param = x; wrapper = document.getElementById('wrapper'); wrapper.innerHTML = ''; for(f=0;f<wrapper.offsetWidth-12;f=f+12){ showLine(f+'e'); showLine(f+'h'); } }; function showLine(z){ div[z] = document.createElement('div'); div[z].setAttribute('class','line'); div[z].style.left=parseInt(z)+'px'; headDiv[z] = document.createElement('div'); headDiv[z].setAttribute('class','point'); wrapper.appendChild(div[z]); div[z].appendChild(headDiv[z]); head(z); show(z,a,b,c); }; function destroyLine(z){ clearInterval(showTimer[z]); wrapper.removeChild(div[z]); showLine(z); }; function randomChar(x){ if(param==1){if(x){ var rand = "<img src='symbols/"+Math.floor(Math.random()*25)+".gif'/>";}else {var rand = "<img src='symbols/"+Math.floor(Math.random()*25)+"n.gif'/>";} return rand; } if(param==2){ var chars = new Array('A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z'); var rand = Math.floor(Math.random()*chars.length); return chars[rand]; } if(param==3){ var chars = new Array('A','Б','В','Г','Д','Е','Ж','З','И','К','Л','М','Н','О','П','Ю','С','Т','У','Ф','Х','Ц','Ч','Ш','Ъ','Э','Я'); var rand = Math.floor(Math.random()*chars.length); return chars[rand]; } if(param==4){ var chars = new Array('Х','О'); var rand = Math.floor(Math.random()*chars.length); return chars[rand]; } if(param==5){ var chars = new Array('1','0'); var rand = Math.floor(Math.random()*chars.length); return chars[rand]; } }; function head(z){ setInterval(function(){headDiv[z].innerHTML=randomChar('x');},20); }; function randomNumber(mx){ return Math.floor(Math.random()*mx); }; function show(z){ i[z] = 1; showTimer[z] = setInterval(function(){ a[z] = randomNumber(1000); b[z] = randomNumber(400); c[z] = randomNumber(80); var char = document.createElement('div'); char.innerHTML = randomChar(); div[z].insertBefore(char,headDiv[z]); fade(char,20,1000+a[z]); if(i[z]>=b[z]){fade(div[z],0,3000,function(){destroyLine(z)});}else{i[z]++;} },c); }; function fade(obj,to,time,callback){ IE=/*@cc_on!@*/false; if(IE){ from = obj.style.filter.replace(/.*opacity=([0-9]*).*/,'$1'); if(!from){from=100;} from=parseFloat(from); } else{ var from=obj.style.opacity; if(from==''){from=1;} from=parseFloat(from); to=to/100; } var start = new Date().getTime(); setTimeout(function(){ var now=(new Date().getTime())-start; var progress=now/time; var result=(to-from)*progress+from; if(IE){obj.style.filter="alpha(opacity="+result+")";}else{obj.style.opacity=result;} if(progress<1){setTimeout(arguments.callee,30);} else{ if(IE){obj.style.filter="alpha(opacity="+to+")";} else{obj.style.opacity=to;} if(callback){setTimeout(callback,0);} }},30); }; </script> Картинки, находящиеся в архиве, загружаем в корень. Материал взят с сайта infoscript.ru
Теги: Скачать Матричный эффект
| |||||
Категория: JavaScript's | Просмотров: 3227 | Добавил: antisept | Рейтинг: 5.0/1 | | |||||
Теги: |
Пока комментариев нет. Ты можешь быть первым! | |
Кроме того, материал перепечатывали с сайта на сайт, ставили... файл можно найти на Вэбочке (название tables_tablichki_dli_foruma.js).