Membuat Gambar Selalu Terlihat

Tidak ada salahnya kalau kamu mencoba yang satu ini, yaitu membuat gambar yang selalu terlihat di pojok bawah sebelah kiri. Gambar ini tidak selalu yang bergerak, bisa juga yang diam dan kamu juga dapat menaruh iklan disini jadi gambar kamu akan selalu terlihat oleh pengunjung walupun skrolnya diturunkan atau dinakkan.

Contohnya seperti ini :Ingin tau cara2nya? ikuti petunjuk di bawah ini :
Langkah 1

  1. Buatlah gambar yang ingin ditampilkan, usahakan tidak melebihi 125x125pxl karena kalau terlalu besar nanti mengganggu tampilan halan utama anda dan akhirnya pengunjung agak kurang nyaman. Bisa gambar animasi atau gambar biasa, dibawah adalah contoh gambar bergerak :


  2. Uploadlah gambar tersebut ke hosting tempat kamu menyimpan gambar, klik disini untuk tutorial upload gambar di Photobucket.Com
  3. Catat alamat gambar kamu kalau kamu pakai Photobucket.Com sebagai hosting penyimpanan gambar kamu maka salinlah alamat link yang berada di Direct Link
Langkah 2
  1. Silahkan login ke bloger id kamu dan masuk di Edit HTML
  2. Copy lalu paste kode di bawah ini persis di atas kode ]]>><b:skin>

    3. #top_image {
    position:fixed;
    _position:absolute;
    bottom:5px;
    left:5px;
    clip:inherit;
    _top:expression(document.documentElement.scrollTop+
    document.documentElement.clientHeight-this.clientHeight);
    _left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); }

  3. Copy lalu paste kode di bawah ini persis dibawah kode <body>

    4. <div id='top_image'>
    <img border='0' src='http://i419.photobucket.com/albums/pp277/khusnulhidayat/Doraemon_thumb.gif'/>
    </div>

  4. Klik tombol simpan template
Kode warna mearah berikut ini :

<img border='0' src='http://i419.photobucket.com/albums/pp277/khusnulhidayat/Doraemon_thumb.gif'/>

Silahkan ganti dengan alamat gambar kamu tapi kalau kamu males bikin gambar, ya gak perlu dirubah kodenya.

Label:

Comments :

3 komentar to “Membuat Gambar Selalu Terlihat”
DegDegan.duniamaya98 mengatakan...
on 
6 Januari 2009 pukul 14.11

nice tutorial.

BlOg GuE mengatakan...
on 
18 Juni 2009 pukul 13.40

hebat,ini dia yang gw cari2,thanks yaa bro

rommm mengatakan...
on 
16 Agustus 2009 pukul 16.07

ngga ada kode ini di blog saya : b:skin
gimana ya??

Posting Komentar

Langganan: Posting Komentar (Atom)
 

Komentar Terbaru

Memuat...

Belum gabung di blog ini? buruan gabung!