Scriptul urmator creaza efectul de imagine pe care-l puteti observa in aceasta pagina, zbor de fluturi.
Daca dati click pe oricare din fluturi, acestia dispar.



Pentru a adauga acest script intr-o pagina web:
1. Copiati imaginea cu fluture de AICI, adaugati imaginea intr-un director "imgs/" aflat in acelasi catalog in care aveti pagina HTML care va folosi scriptul.
2. Introduceti in documentul HTML, urmatorul script:
<script type="text/javascript">

var Ymax=8; // Nr. maxim de pixeli in pasul orizontal
var Xmax=8; // Nr. maxim de pixeli in pasul vertical
var Tmax=10000; // Nr. de milisecunde dintre schimbarea parametrilor

// Matricea care contine cale catre imagine folosita
// Nr. de elemente adaugate in matrice va fi
// nr. de imagini afisate in browser
var floatimages=new Array();
floatimages[0]='addons/javascript/fluture.gif';
floatimages[1]='addons/javascript/fluture.gif';

// Variabilele cu parametri specifici diferitelor browsere
// Pozitionarea absoluta a cadrului care contine imaginile
var NS4 = (navigator.appName.indexOf("Netscape")>=0 && parseFloat(navigator.appVersion) >= 4 && parseFloat(navigator.appVersion) < 5)? true : false;
var IE4 = (document.all)? true : false;
var MOZ = (parseFloat(navigator.appVersion) >= 5 && navigator.appName.indexOf("Netscape")>=0 )? true: false;
var wind_w, wind_h, t='', IDs=new Array();
for(i=0; i<floatimages.length; i++){
t+=(NS4)?'<layer name="pic'+i+'" visibility="hide" width="10" height="10"><a href="javascript:hidebutterfly()">' : '<div id="pic'+i+'" style="position:absolute; visibility:hidden;width:10px; height:10px"><a href="javascript:hidebutterfly()">';
t+='<img src="'+floatimages[i]+'" name="p'+i+'" border="0">';
t+=(NS4)? '</a></layer>':'</a></div>';
}
// Adauga cadrul cu imaginile in document
document.write(t);

// Functia pentru miscarea imaginilor
function moveimg(num){
if(getidleft(num)+IDs[num].W+IDs[num].Xstep >= wind_w+getscrollx())IDs[num].Xdir=false;
if(getidleft(num)-IDs[num].Xstep<=getscrollx())IDs[num].Xdir=true;
if(getidtop(num)+IDs[num].H+IDs[num].Ystep >= wind_h+getscrolly())IDs[num].Ydir=false;
if(getidtop(num)-IDs[num].Ystep<=getscrolly())IDs[num].Ydir=true;
moveidby(num, (IDs[num].Xdir)? IDs[num].Xstep : -IDs[num].Xstep , (IDs[num].Ydir)? IDs[num].Ystep: -IDs[num].Ystep);
}

function propimg(num){
IDs[num].Ydir=Math.floor(Math.random()*2)>0;
IDs[num].Xdir=Math.floor(Math.random()*2)>0;
IDs[num].Ystep=Math.ceil(Math.random()*Ymax);
IDs[num].Xstep=Math.ceil(Math.random()*Xmax)
setTimeout('propimg('+num+')', Math.floor(Math.random()*Tmax));
}

function getscrollx(){
if(NS4 || MOZ)return window.pageXOffset;
if(IE4)return document.body.scrollLeft;
}

function getscrolly(){
if(NS4 || MOZ)return window.pageYOffset;
if(IE4)return document.body.scrollTop;
}

function getid(name){
if(NS4)return document.layers[name];
if(IE4)return document.all[name];
if(MOZ)return document.getElementById(name);
}

function moveidto(num,x,y){
if(NS4)IDs[num].moveTo(x,y);
if(IE4 || MOZ){
IDs[num].style.left=x+'px';
IDs[num].style.top=y+'px';
}}

function getidleft(num){
if(NS4)return IDs[num].left;
if(IE4 || MOZ)return parseInt(IDs[num].style.left);
}

function getidtop(num){
if(NS4)return IDs[num].top;
if(IE4 || MOZ)return parseInt(IDs[num].style.top);
}

function moveidby(num,dx,dy){
if(NS4)IDs[num].moveBy(dx, dy);
if(IE4 || MOZ){
IDs[num].style.left=(getidleft(num)+dx)+'px';
IDs[num].style.top=(getidtop(num)+dy)+'px';
}}

function getwindowwidth(){
if(NS4 || MOZ)return window.innerWidth;
if(IE4)return document.body.clientWidth;
}

function getwindowheight(){
if(NS4 || MOZ)return window.innerHeight;
if(IE4)return document.body.clientHeight;
}

function init(){
wind_w=getwindowwidth();
wind_h=getwindowheight();
for(i=0; i<floatimages.length; i++){
IDs[i]=getid('pic'+i);
if(NS4){
IDs[i].W=IDs[i].document.images["p"+i].width;
IDs[i].H=IDs[i].document.images["p"+i].height;
}
if(MOZ || IE4){
IDs[i].W=document.images["p"+i].width;
IDs[i].H=document.images["p"+i].height;
}
propimg(i);
moveidto(i , Math.floor(Math.random()*(wind_w-IDs[i].W)), Math.floor(Math.random()*(wind_h-IDs[i].H)));
if(NS4)IDs[i].visibility = "show";
if(IE4 || MOZ)IDs[i].style.visibility = "visible";
startfly=setInterval('moveimg('+i+')',Math.floor(Math.random()*100)+100);
}}

function hidebutterfly(){
for(i=0; i<floatimages.length; i++){
if (IE4)
eval("document.all.pic"+i+".style.visibility='hidden'")
else if (MOZ)
document.getElementById("pic"+i).style.visibility='hidden'
else if (NS4)
eval("document.pic"+i+".visibility='hide'")
clearInterval(startfly)
}
}

if (NS4||MOZ||IE4){
window.onload=init;
window.onresize=function(){ wind_w=getwindowwidth(); wind_h=getwindowheight(); }
}
</script>

Un Test simplu in fiecare zi

HTML
CSS
JavaScript
PHP-MySQL
Engleza
Spaniola
Care tip de <input> creaza un element cu data tip calendar?
type="text" type="date" type="button"
<input type="date" name="set_date" value="2012-10-15" />
Ce proprietate CSS adauga efect de umbre la text?
font-style color text-shadow
h2 {
  text-shadow: 2px 3px 3px #a0a1fe;
}
Clic pe functia care adauga elemente noi la sfarsitul unui array.
pop() shift() push()
var pags = ["lectii", "cursuri"];
pags.push("download", "tutoriale");
alert(pags[2]);            // download
Ce functie aranjeaza un array in ordine crescatoare, dupa chei, mentinand corelatia dintre chei si valori?
asort() ksort() sort()
$lang =[10=>"PHP", 20=>"JavaScript", "site"=>"coursesweb.net");
ksort($lang);
var_export($lang);     // array ("site"=>"coursesweb.net", 10=>"PHP", 20=>"JavaScript")
La adjectivul "big" (mare), care este forma de Comparativ (mai mare)?
biggest biger bigger
He is bigger than his sister.
- El este mai mare decat sora lui.
Care este Comparativul adjectivului "grande" (mare)?
menos grande más grande el más grande
Él es más grande que su hermana.
- El este mai mare decat sora lui.
Efect zbor fluturi

Last accessed pages

  1. Creare link-uri (8201)
  2. Cursuri si Tutoriale: Engleza, Spaniola, HTML, CSS, Php-Mysql, JavaScript, Ajax (99710)
  3. Prezentul continuu - Exercitii si teste incepatori (14574)
  4. Prezentul simplu si continuu - Present Tense Simple and Continuous (67827)
  5. Elemente principale HTML (12737)

Popular pages this month

  1. Cursuri si Tutoriale: Engleza, Spaniola, HTML, CSS, Php-Mysql, JavaScript, Ajax (1726)
  2. Curs HTML gratuit Tutoriale HTML5 (1366)
  3. Curs si Tutoriale JavaScript (1300)
  4. Curs PHP MySQL, Tutoriale si Scripturi PHP (1224)
  5. Curs CSS Online Tutoriale CSS3 (1173)