Cara Bikin Float Gambar Pada Blog

Cara Bikin Float Gambar Pada Blog ,Cara mudah Bikin Float Gambar Pada Blog 


Hello Pengunjung BLOGGER,Pada tutorial Blogg kali ini saya berbgai tips Cara Bikin Float Gambar Pada Blog,Pada Awal nya 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.

Saya Akan Langsung Memulai Topik Kita..Baiklah Sobat Hanya Mengikuti Langkah Berikut :


1. Login Ke Akun Blog Sobat
2. Klik Tab Tata Letak
3. Klik Tab Elemen Halaman
4. Klik Tambah Gadget
5. Klik pilhan HTML/JavaScript
6. Pastekan script di bawah ini ke kolom Konten..

<style type="text/css">

#topbar{
background-color:#61380B;
position:absolute;
visibility:hidden;
z-index:100;
border:2px
#FFFFFF groove;
-moz-border-radius:8px;
padding-top:6px;
padding-left:1px;
padding-bottom:3px;
padding-right:1px;
-moz-opacity:0.63;
filter:alpha(opacity=63);opacity:0.63;
}
#topbar a img{
color:transparent;text-decoration:none;border:none;
}
</style>

<script language="javascript">

/***************************************************************
* Floating Top Bar script - Dynamic Drive (http://www.dynamicdrive.com)
* Sliding routine by Roy Whittle (http://www.javascript-fx.com/)
* Simplified Floating by !CrazyDavinci! (http://crazydavinci.net)
* This notice must stay intact for legal use.
* Visit http://www.dynamicdrive.com/ for full source code
***************************************************************/
startX = parseInt(screen.width/2)+500;startY = parseInt(screen.height/2)-110
function iecompattest(){return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body}
function staticbar(){
ns = (navigator.appName.indexOf("Netscape") != -1) || window.opera;
d = document;
el= d.getElementById("topbar");
barheight= el.offsetHeight;
function ml(id){
el.style.cssText="visibility:visible;width:75px";if(d.layers)el.style=el;
el.sP=function(x,y){this.style.right=x+"px";this.style.top=y+"px";};
el.y = ns ? pageYOffset + innerHeight : iecompattest().scrollTop + iecompattest().clientHeight;
el.x = startX;el.y -= startY;return el;
}
window.stayTopright=function(){
var pY = ns ? pageYOffset + innerHeight - barheight: iecompattest().scrollTop + iecompattest().clientHeight - barheight;
ftlObj.y += (pY - startY - ftlObj.y)/8;ftlObj.sP(ftlObj.x, ftlObj.y);setTimeout("stayTopright()", 10);
}
ftlObj = ml("topbar");stayTopright();
}
if (window.addEventListener) window.addEventListener("load", staticbar, false);
else if (window.attachEvent) window.attachEvent("onload", staticbar);
else if (document.getElementById) window.onload=staticbar </script>

<div id ="topbar" align="center">
<a href="KASIH ALAMAT  BLOG YANG ANDA INGINKAN" target="_blank">
<img src="KASIH ALAMAT GAMBAR YANG DI INGINKAN " width="70px" /></a><blink><font face="Times New Roman" size="2,8" color="#FF0000"><br />About Me<br /></font></blink></div>


 Ket : 
Url Ini KASIH ALAMAT  BLOG YANG ANDA INGINKAN, merupakan letak dimana ABOUT ME diletakkan silahkan isi alamat  URL yang sobat inginkan 
untuk yg ini KASIH ALAMAT GAMBAR YANG DI INGINKAN merupakan URL gambar jadi isikan URL gambar yang sobat inginkan
 
7. Klik Simpan
8. Selesai


Selamat Mencoba 


Sumber

74 comments:

  1. . . ouwwwwwwwwwwwwwwwwwwwwwwww,, jadi bikin kotak "about me" itu. aq kira bikin apa. tapi keren juga. ijin bookmark ya?!? sapa tau besok^ aq butuh. he..86x . .

    ReplyDelete
  2. waah rupanya jumpa disini.. kebetulan banget... maakasih banyak Yaa :D

    ReplyDelete
  3. gambarnya bisa diganti jadi iklan gk sobat??

    ReplyDelete
    Replies
    1. Seperti nya bisa sob,,Karena bisa di taruh Gamber + link iklan tersebut sob,,
      meskipun sbernarnya sya blum coba sih,,, heehe..

      Dicoba sob,, mungkin berhasil.

      Delete
  4. hellloo sigli, kunjungan perdana nih ane udah folback juga, untuk gambar melayangnya boleh juga buat naruh iklan nih :)

    ReplyDelete
    Replies
    1. hy jga,,trima kasih atas follow nya sobat,,

      Delete
  5. absen sore di blog om sigli

    ReplyDelete
    Replies
    1. mkasi sobat udah brkunjung lgi ke blog saya ,, :)

      Delete
  6. hihihih tapi kalo yang bikin kayak di warungbebas itu gimana ya sob? cuma widget paling bawah aja yang ngikuti

    ReplyDelete
    Replies
    1. langsung aja di simak di http://sigli-cyber.blogspot.com/2012/08/cara-membuat-widget-di-sudut-blog.html

      Delete
  7. Thank's sob atas infonya.. cuman banyak kali ya kodenya ?? ada yg lebih simple ga ?

    ReplyDelete
    Replies
    1. Sperti nya hnya itu yg bisa saya dpt kan,,

      coba sobat cri di mbah google ,mungkin ada code yg lebh simpel

      Delete
  8. maaf sob ane baru bisa mampir , soalnye ane banyak job, thanks infonya , ane juga udh share tentang tips floating ini

    ReplyDelete
    Replies
    1. Gpp sobat...Silahkan mampir kpn aja sewaktu sobat bisa Lkukan,,

      Delete
  9. Ooo.. itu Cara bkin float gambar pda blog, aku kira apa yang melayang layang, tulisan about me na kurang jelas ya sob hehehh,,

    ReplyDelete
    Replies
    1. hehe..itulah sob yg dinamakan float gambar ,,,

      Delete
  10. nice share gan, tips cara buat float gambar pda blog ;D

    ReplyDelete
    Replies
    1. iya,,,sma-sma,,Silahkan dicoba apabila itu bermanfaat buat sobat

      Delete
  11. ow, gambar yang melayang itu dinamakan floating ya sob. thx sob. baru tau ane.. :D

    ReplyDelete
    Replies
    1. iya sob,,maklum lah sob, kita masih lemah dalam mencari Ilmu ataupun hal2 yg baru,,

      Delete
  12. Replies
    1. silahkan dicoba,, jika sobat tertarik mencoba nya

      Delete
  13. Replies
    1. sma-sma,,Silahkan dicoba jika itu bermanfaat buat sobat

      Delete
  14. nah,, ni in yg gue cari...
    berguna bgt! :)

    ReplyDelete
    Replies
    1. ambilah jika itu bermanfaat bgi kita semua

      Delete
  15. Nice info mass.. salam kenal yah

    ReplyDelete
  16. wah mantap sob....? tp agak menambah berat blog g ya sob...?

    ReplyDelete
    Replies
    1. gk kok sobat,, buktinya blog ini tdk terlalu berat kan..

      Delete
  17. wah keren sob, boleh dicoba nih :D

    thanks ya...

    ReplyDelete
  18. Wah dapat ilmu baru ane, bermanfaat sekali...

    Salam sukses selalu sob...

    ReplyDelete
    Replies
    1. mkasi sobat,,,
      semoga itu bisa menjadi bermanfaat utk sobat

      Delete
  19. terima kasih banyak atas informasi yang menarik ini..
    salam sahabat :D

    ReplyDelete
    Replies
    1. sma-sama,,,
      dan mkasi udah mampir kembali,,

      slam blogger

      Delete
  20. Replies
    1. silahkan langsung dicoba,,smoga berhasil

      Delete
  21. ini yang gambar melayang itu ya gan ? sip sip dah tutorialnya

    ReplyDelete
  22. Terimakasih atas tutorialnya kawan , . .

    ReplyDelete
    Replies
    1. sma2..Smoga tutorial ini bermanfaat utk sobat

      Delete
  23. artikel yg bagus sekali sob..
    izin untuk mengshare ulang ya..


    #Salam Selamat

    ReplyDelete
    Replies
    1. silahkan sobat,,asalkan dinyatakan sumber nya..

      Delete
    2. KO SUMBER BLOG ANE GA AD YA,hehehhe just kiding kk

      Delete
    3. ok nih,,

      ada tuh sumber nya

      bru ditaruh,,Mkasi sob

      Delete
  24. Kunjungan perdana juga disini sob..

    ReplyDelete
  25. wah, keren infonya, thx infonya.
    blognya juga keren

    #Salam sehat dari saya


    ReplyDelete
    Replies
    1. wah... makasi pujian nya,,
      dan makasi juga udah mampir ke blog ini

      Delete
  26. Apa ini tidak memberatka loading blog mas.

    ReplyDelete
    Replies
    1. menurut sya sih enggak ,,asalkan kita tdk menambah widget secara berlebihan

      Delete
  27. sudah tak coba dan tralalalalallal. jadi deh. thank you

    ReplyDelete
  28. ahhahaha... iseng2 browsing ekh ketemu tutorial ini
    alhamdulilah tutorial saya ini bisa membantu teman2

    ReplyDelete
    Replies
    1. ok,, mksi nih buat sobat,,tutorialnya sngat memantu utk kita

      Delete
  29. wah,keren banget.ilmu ini bermanfaat bagi saya

    ReplyDelete

Silahkan Anda Berkomentar Dengan Baik dan Sopan.

~Pesan Komentar Yang Menyertakan Link Hidup,SPAM,JUNK ,dan sejenisnya ,akan Saya Hapus Dari Postingan ini.

~Bagi Yang Meng-Follow Blog Ini,Jangan Lupa Dikonfirmasi Agar Saya Bisa Meng-Follow sobat kembali

~Maaf juga jika saya sering kali tidak membalas komentar dari Anda

Komentar Anda sangat bermanfaat untuk perkembangan blog ini. Terima Kasih!!!

Powered by Blogger.