Cara Membuat Floating Images
"Virtual Max" memanfaatkan sepenuhnya dari fitur ini dengan menciptakannya sebuah gambar melayang yang bergerak disekitar halaman dan masing-masing gambar mengikuti jalur yang telah ditentukan secara acak.
selain itu gambar dapat diklik, membuat efek ini tidak saja gila tapi juga keren dan sangat praktis.
Contoh:
(Lihat 3 buah gambar Balon yang melayang dan itu merupakan 3 buah Link ..)Cara memasang Floating Images
Langkah pertama:
Copy Javascript berikut ini diatas kode</head>
<script type="text/javascript" src="moveobj.js"> </script>
<script type="text/javascript">
/***********************************************
* Floating image script- By Virtual_Max (http://www.geocities.com/siliconvalley/lakes/8620)
* Modified by Dynamic Drive for various improvements
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/
//Step 1: Define unique variable names depending on number of flying images (ie:3):
var flyimage1, flyimage2, flyimage3
function pagestart(){
//Step 2: Using the same variable names as 1), add or delete more of the below lines (60=width, height=80 of image):
flyimage1=new Chip("flyimage1",47,68);
flyimage2=new Chip("flyimage2",47,68);
flyimage3=new Chip("flyimage3",47,68);
//Step 3: Using the same variable names as 1), add or delete more of the below lines:
movechip("flyimage1");
movechip("flyimage2");
movechip("flyimage3");
}
if (window.addEventListener)
window.addEventListener("load", pagestart, false)
else if (window.attachEvent)
window.attachEvent("onload", pagestart)
else if (document.getElementById)
window.onload=pagestart
</script>
Langkah Kedua:
Gunakan contoh syntax berikut ini untuk membuat Floating Images kedalam tag <body>.
<!-- Step 4: Define your flying images. For each image's ID tag, use the same variable names as 1) above -->
<DIV ID="flyimage1" STYLE="position:absolute; left: -500px; width:47; height:68;">
<A HREF="http://dynamicdrive.com"><IMG SRC="test.gif" BORDER=0></a>
</DIV>
<DIV ID="flyimage2" STYLE="position:absolute; left: -500px; width:47; height:68;">
<A HREF="http://dynamicdrive.com"><IMG SRC="test.gif" BORDER=0></a>
</DIV>
<DIV ID="flyimage3" STYLE="position:absolute; left: -500px; width:47; height:68;">
<A HREF="http://dynamicdrive.com"><IMG SRC="test.gif" BORDER=0></a>
</DIV>
Keterangan:
Kode script tersebut sebenarnya merupakan kode HTML biasa, untuk menampilkan sebuah gambar pada halaman web.
sumber: dynamicdrive
0 komentar:
Post a Comment
Catatan :
Untuk menyisipkan gambar kedalam komentar, gunakan tag : [img]URL_Gambar[/img]
atau <i rel="image">URL_Gambar</i>
Untuk Video Youtube : [youtube]URL_Video[/youtube]
atau <i rel="youtube">URL_Video</i>
Untuk "Kutipan", gunakan : [blockquote]Kutipan_Anda[/blockquote]
atau <b rel="quote">Kutipan_Anda</b>
Untuk menyisipkan Kode: [code]KODE[/code]
atau <i rel="code">KODE</i>
atau <i rel="pre">KODE</i>
Dan untuk menyisipkan smiles/ emoticon, lihat kode Emoticon