Monday, April 6, 2015

Memasang Tooltip (KODE)

Hai, Gifta's comeback! Sekarang Gifta dapet req tuto dari Kak Annisa!
Dia tanya caranya kalau cursor diarahin link read more terus ada tulisan berbackground kecil itu gimana? Nah, itu namanya tooltip kak! Itu otomatis kalo kakak pasang kode tooltip

Cara pasangnya:

1. Blogger >>> Template >>> Edit HTML
2. Cari kode </head>
3 Copy kode di bawah dan paste di bawah kode </head>
<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>
4. Sekarang kamu copy kode di bawah ini dan paste di atas kode </style>
#s-m-t-tooltip {
z-index: 99999;
    background: #49A9F3;
    font-size: 10px;
    line-height: 12px;
    font-family: trebuchet ms;
    letter-spacing: 1px;
    text-transform: lowercase;
    color: #ffffff;
    text-align: center;
    padding: 5px 10px 5px 10px;
    display: block;
    border-radius: 5px;
    margin: 24px 14px 7px 12px;
    -webkit-box-shadow: 2px 2px 2px rgba(50, 50, 50, 0.1);
    -moz-box-shadow: 2px 2px 2px rgba(50, 50, 50, 0.1);
    box-shadow: 2px 2px 2px rgba(50, 50, 50, 0.1);
Okey, save!

Biru: kode background tooltip 
Merah: ukuran text
Hijau: font text
Ungu: warna text
Cara memakai? KLIK SINI

No comments

Post a Comment