Huxsna


"...Follow me on Instagram @huxsna..."


Saturday, 25 April 2015 - 0 Complain

Assalamualaikum ! Harini Husna nak ajar korang cara buat Tooltips !

Dulu.. Husna tertanya tanya.. apa tu Tooltipss?! rupa rupanya.. Ini tooltips...


Okey macam mana tuuuuuu?  OH, TUTORIAL INI HANYA UNTUK BLOGSKIN 

  • Buka Blog
  • Template
  • Ctrl+f search code : </style>
  • copy code bawah ni.. and pastekan di ATAS code </style>
#s-m-t-tooltip {
background: #aaa;
font-size: 12px;
line-height: 12px;
font-family: comic sans ms;
font-size:12px;
letter-spacing: 2px;
text-transform: lowercase;
color: #000;
text-align: left;
padding: 5px 10px 5px 10px;
display: block;
border-radius: 5px;
margin: 24px 14px 7px 12px;
border: 2px solid #000;
-moz-box-shadow: 0 0 0px 2px #eee;
-webkit-box-shadow: 0 0 0px 2px #333;
}



Merah : Background Tooltip
Orange : Tebal border tooltips
biru: solid/dotted/dashed
purple : warna border


NEXT! 

  • Ctrl+f search code </html>
  • copy code bawah ni
  • pastekan kat ATAS code </html>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js">
<script src='http://static.tumblr.com/7qjmkr5/IUmmdsy41/jquery.style-my-tooltips.js' type='text/javascript'/>
<script>
    (function($){
        $(document).ready(function(){
            $(&quot;[title]&quot;).style_my_tooltips();
        });
    })(jQuery);
</script>



  • Jadi, kalau korang nak adakan tooltip , copy code ni.. and pastekan je kat mana mana
<a href="your link"title="tulis tooltips yang kamu inginkan">Tajuk</a>
Merah : Link
Biru : Tooltip yang korang nak
orange : tajuk lah


Post a Comment

Ada masalah? Ada benda yang hendak dipuji? Suka dengan blog nie? Complain lah apa lagi!


Hello From The Otherside!

click this button ^^

de' little map

cbox

Fairytales Time Machine

credit