Elektronik Devreler: Animasyonlu Açılır Perde Html Kodları

<!DOCTYPE html>
<html>
<head>

window.onload = resimFunc;

function perdeFunc() {

setTimeout(hosFunc, 3000);

document.getElementById("fonSol").style.transform = "translateX(-750px)";
document.getElementById("fonSag").style.transform = "translateX(1250px)";
document.getElementById("hos").innerHTML = "HOŞ GELDİNİZ...";

}

function resimFunc() {
document.getElementById("fonSol").style.transform = "translateX(0px)";
document.getElementById("fonSag").style.transform = "translateX(650px)";

}

function hosFunc() {
document.getElementById("hos").innerHTML = "";

}

</script>

<style>

#divPerdeSol img{
width:750px;
height:950px;
position:fixed;
top:1px;
left:0px;
background:;
z-index:9998;
}

#divPerdeSag img{
width:750px;
height:950px;
position:fixed;
top:1px;
/*left:650px;*/
background:;
z-index:9998;
}

#fonSol, #fonSag{-webkit-transition:1.9s;}
#fonSol, #fonSag{-moz-transition:1.9s;}

H1{
position:fixed;
top:200px;
left:350px;
color:green;
align-text:center;
font-size:97px;
}
</style>

</head>
<body>

<BR>

<div id="divPerdeSol"> 
<body  onmousemove="myTimer();" onmouseup="perdeFunc();" ondblclick="resimFunc();" title="Perdeyi açmak için tıklayın..."><img id="fonSol"

src="http://elektrosin.com/resim/uzay_fon.gif" ></body>
</div>

<div id="divPerdeSag"> 
<body  ondblclick="resimFunc();" title="Perdeyi açmak için  tıklayın..."><img id="fonSag" src="http://elektrosin.com/resim/uzay_fon.gif"

></body>
</div>

<b style="position:fixed; left:350px; opacity:0.4; color:linen; font-size:100px; font-style: oblique; z-index:9999;">EFEKTLİ PERDE</b><br>

</html>

Elektronik Devreler

Ziyaretçi Sayısı

ARAMA YAPIN

30 Mayıs 2016 Pazartesi

Animasyonlu Açılır Perde Html Kodları

Hiç yorum yok:

Yorum Gönder