Tooltips

credit: Jauza'
APA ITU TOOLTIPS?
kamu sentuh link di bawah ini, yaaaa ....

Blognya Mikaila

Itu dia tooltips. Kayak tulisan kecil, ada background gitu, kan? Kan, kan, kan?
Nah, aku mau kasih tutorialnya nih, sumbernya Jauza'



  • Dashboard >> Template >> Edit HTML
  • Cari kode ini untuk Denim/Simple Template
]]></b:skin>

  • Cari kode ini untuk Classic/Blogskin
</style>

  • Copy Paste kode ini DIATAS kode yang kamu cari tadi
#s-m-t-tooltip {
background: url(URL BACKGROUND);
font-size: 9px;
line-height: 11px;
font-family: arial;
letter-spacing: 2px;
text-transform: lowercase;
color: #fff;
text-align: center;
padding: 5px 10px 5px 10px;
display: block;
border-radius: 5px;
margin: 24px 14px 7px 12px;
}

  • Cari kode ini untuk Denim/Simple Template
</head>

  • Cari kode ini untuk Classic/Blogskin
</html>

  • Copy Paste kode ini DIATAS kode yang kamu cari tadi
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<script type="text/javascript" src="http://static.tumblr.com/7qjmkr5/IUmmdsy41/jquery.style-my-tooltips.js"></script>
<script>
    (function($){
        $(document).ready(function(){
            $("[title]").style_my_tooltips();
        });
    })(jQuery);
</script>
Note :

  • Untuk pasang pada link :
<a href="link here" title"title here" />

  • Untuk pasang pada gambar :
<img src="URL Image" title="title here" />

1 comment: