Friday, July 6, 2012

Simple Javascript Floating Image, Object, Avatar, dan Lain-lain

Saya tertarik dengan dengan float image yang pernah saya lihat di blog-blog atau forum untuk di pasang di blog saya. setelah mencari di google saya menemukan script floating dari dynamic drive yang telah di ringkas dan di buat simple oleh joy atau crazy davinci . script ini berfungsi untuk menampilkan gambar, link, mp3 atau apa saja di sidebar page kita.

Caranya mudah dan simple :


  • Letakkan kode berikut setelah tag <body> sebelum tag </body>
<div id="avatar">
<img src="YOUR IMAGE URL" width=" 80" height=" 80"/>
</div> 
  •  Letakkan kode berikut setelah tag <head> sebelum tag </head>
<link rel="stylesheet" type="text/css" href="http://static.int.crazydavinci.net/style/float_joy.css " />
<script type="text/javascript" src="http://static.int.crazydavinci.net/script/float_joy.js"></script>
Silahkan download dan edit file CSS http://static.int.crazydavinci.net/style/float_joy.css kemudian upload di hostingan sendiri.
Untuk modifikasi file .js nya silahkan download dan edit file http://static.int.crazydavinci.net/script/float_joy.js kemudian upload di hostingan sendiri.


  • Keterangan: 
startX = parseInt(screen.width/2)+400;
startY = parseInt(screen.height/2)-110
starX akan menjadi objek horizontal dari tengah halaman anda.
starY  akan menjadi objek vertikal.
 Nah untuk mengganti gambar menjadi mp3, atau apa saja silahkan modifikasi tag div avatar nya :

<div id="avatar">
<img src="YOUR IMAGE URL" width=" 80" height=width=" 80"/>
</div>
Ganti saja yang saya beri warna merah di atas dengan kode embed mp3 atau yang kamu mau.

Ok, saya rasa cukup jelas dan semoga berguna.
Preview bisa di liat di blog favorit saya atau di SINI .

Referensi : http://p-cbn.blogspot.com/2011/03/simple-javascript-floating-image-object.html

No comments:

Post a Comment