Cara Membuat Animasi Window Browser

Cara Membuat Animasi Window Browser - Langsung saja deh berikut adalah cara membuat animasi browser atau biasa disebut Animated Window Opener. Langsung saja deh cekibrot! {Aduh kebanyakan Langsung sja :p}

Animated Window Opener (klik untuk memperbesar)

View Demo

Animated Window Opener merupakan animasi yang berfungsi membuat link terbuka (Popup) dijendela baru secara pelahan dan sedikit demi sedikit dan akhirnya akan menutupi jendela utama.

Penerapan dalam blog kita bisa dilihat dibawah ini:

 Javascript

<script type="text/javascript">
<!--
var winheight=100
var winsize=100
var x=5
function openwindow(thelocation){
temploc=thelocation
if (!(window.resizeTo&&document.all)&&!(window.resizeTo&&document.getElementById)){
window.open(thelocation)
return
}
win2=window.open("","","scrollbars")
win2.moveTo(0,0)
win2.resizeTo(100,100)
go2()
}
function go2(){
if (winheight>=screen.availHeight-3)
x=0
win2.resizeBy(5,x)
winheight+=5
winsize+=5
if (winsize>=screen.width-5){
win2.location=temploc
winheight=100
winsize=100
x=5
return
}
setTimeout("go2()",10)
}
//-->
</script>
<div style="font-family: Mistral; text-align: center;">
<span style="font-size: 40px;"><a href="javascript:openwindow('http://serpihanduka.blogspot.com/2012/07/animated-window-opener.html')">Demo Page</a>
</span> </div>
<div style="font-family: Mistral; text-align: center;">
<span style="font-size: 40px;"><a href="javascript:openwindow('http://koderator.blogspot.com')">Koderator</a></span></div>

Keterangan

Script	Keterangan
setTimeout("go2()",10)	Cepat lambatnya popup/terbukanya tab baru
font-family: Mistral;	Jenis font, bisa diganti dengan Arial, Verdana, Helvetica dll
text-align: center;	Posisi teks berada ditengah, bisa diganti ataupun dihapus
javascript:openwindow('	Jendela baru, pilih link yang akan kamu buat menjadi open window
font-size: 40px	Ukuran font 40px