Sobat mungkin sudah pada tahu trik menempatkan sesuatu yang selalu berada dipojok keberadaannya ;;) Sekarang Beben juga akan berbagi trik ringan mengenai benda pojokan, tapi dengan variasi hover pada judulnya. Biar tampak lebih gaya dan bergaya sob :)) Kali ini yg akan dipojokan yaitu si burung twitter. Sederhana saja kok sob, hanya memasukan sedikit kode CSS diatas/sebelum kode ]]></b:skin> di template sobat...
.tweetthis {
position: fixed;
bottom: 0;
right: 5px;
text-decoration: none;
}
.tweetthis span {
display: none;
position: absolute;
right: 32px;
bottom: 32px;
padding: 5px;
background: #33C3FA;
text-decoration: none;
font-weight: bold;
font-size: 1.2em;
border: 2px solid #777;
}
.tweetthis:hover span {
display: block;
}
.tweetthis img {
border: none;
}
Setelah itu, masukin nih kode HTML didalam tag <body>. Ingat jangan sampai didalam tag lain :Dposition: fixed;
bottom: 0;
right: 5px;
text-decoration: none;
}
.tweetthis span {
display: none;
position: absolute;
right: 32px;
bottom: 32px;
padding: 5px;
background: #33C3FA;
text-decoration: none;
font-weight: bold;
font-size: 1.2em;
border: 2px solid #777;
}
.tweetthis:hover span {
display: block;
}
.tweetthis img {
border: none;
}
<a class='tweetthis' href='http://twitter.com/share'><img src='http://link-your-image-tweet.png'/><span>Tweet this!</span></a>Lalu save dan lihat hasilnya macam apa hayooo \:D/Click here if you want to be a goodest on creativity Click Here for Be a Master
Loading... |
4 comments
DO NOT EVEN TRY ADD LINK [-X
You can use some HTML tags, such as
<b> - <i> - <a> - http://...jpg/gif/png/bmp - http://youtu.be/...