Wednesday, August 20, 2008

Funny JavaScript in Browser

Aloo..

baru-baru ini gw dapet sedikit ilmu nih.. sayangnya gw lupa tau darimana >_< Soalnya uda lama juga sih taunya..hehe..
Hal yang saya mao share itu:
membuat dan menjadikan gambar-gambar pada browser anda, ketika browsing (di situs yang memiliki gambar2 ber-link) dapat melakukan gerak animasi..
Catatan!
Ini hanya bagi orang yg belum tau saja! Bagi yang sudah tau, skip aja post gw yg ini! :p


Bagi yg belom tau apa itu "JavaScript" ? Saya mao jelasin dikit aja.. dikitttt kok..
JavaScript merupakan sebuah bahasa pemograman web yang berbasis client side scripting. Sebenernya JavaScript ini asal muasalnya dari script yang ada di Netscape (sebuah browser).
Dahulu nama ini sebenarnya "LiveScript". Tapi dikarenakan issue saat itu bhs pemograman JAVA lagi hot2nya.. maka netscape mengubah namanya jadi "JavaScript".
Seiring dengan itu JavaScript menjadi amat populer sekarang.. :)

Oke sekilas tentang JavaScript.. bagi yg belom tau apa itu netscape or client side scripting bisa tanya lebih lanjut ke authornya.. :)

Nah saya mao share nih sedikit hal yg lucu/menarik dalam memainkan sedikit javascript pd browser anda..
Media yang saya gunakan dari om google aja yaa.. :D

Caranya :
1. Browse ke www.google.co.id (disini saya menggunakan sample google)


Google Interface Lakukan Search pada pilihan "gambar", lalu input : younha (contoh yg saya ambil disini,younha, anda bebas memilih siapapun org yg tentunya anda suka :) )

Setelah itu, akan muncul beberapa gambar yg sesuai dengan kunci kriteria yg dipilih..


2. Masukkan script ini pada address browser anda (dalam hal ini saya pake FF3/FireFox 3, uda bisa diliat di gambar kan?? hehe..), copy-paste aja (ditimpa)





javascript:R=0; x1=.1; y1=.05; x2=.25; y2=.24; x3=1.6; y3=.24; x4=300; y4=200; x5=300; y5=200; DI=document.getElementsByTagName("img"); DIL=DI.length; function A(){for(i=0; i-DIL; i++){DIS=DI[ i ].style; DIS.position='absolute'; DIS.left=(Math.sin(R*x1+i*x2+x3)*x4+x5)+ "px"; DIS.top=(Math.cos(R*y1+i*y2+y3)*y4+y5)+" px"}R++}setInterval('A()',5); void(0);


3. tekan GO pd browser.. maka akan muncul animasi gerak yg lucu.. Maka akan muncul seperti pada gambar berikut.


Tekan beberapa kali, maka akan semakin cepat pergerakannya.. :D

Catatan : JavaScript harus diaktifkan pada browser anda.

Yang saya mao tekankan disini adalah, sebuah keindahan JavaScript yg bisa dinput pada addressbar.. membuat hal yg tidak kita pernah duga terjadi.. hehe.. Dan semua ini merupakan kreativitas semata.. :)

Bagi yang pernah belajar JavaScript dan sudah cukup berpengalaman, anda bisa meneliti script tsb untuk pengetahuan semata... hehehe.. Enjoy!

Semoga informasinya berguna!

1 comment: