Tutorial Hidden Cbox #1

Monday, June 15, 2015

Assalamualaikum

Tutorial ni amat sesuai untuk blogger yang taknak semakkan sidebar atau mungkin sidebar dah banyak benda lain so sangat amat digalakkan hide cbox korang. Macam mana rupa hidden cbox ni?


Amacam, berminat? Nahh code nya ;

<style>
.cbox {
position:fixed;
bottom:-205px;
left:10px;
padding:5px;
-webkit-transition-duration:0.8s;
-moz-transition-duration:0.8s;
-ms-transition-duration:0.8s;
-o-transition-duration:0.8s;
transition-duration:0.8s;
}
.cbox:hover {
bottom:0px;
}
</style>

<div class="cbox">
<div style="background: url(http://i.imgur.com/UKVMkFY.png); border-radius: 10px 10px 0px 0px; color: black; font: 14px cambria; height: 20px; letter-spacing: 1px; margin-left: 5px; padding-top: 4px; text-align: center; text-shadow: -1px 0 white, 0 1px white,1px 0 white, 0 -1px white; text-transform: uppercase; width: 185px;">
Shout It Out Here!</div>
YOUR CBOX CODE GOES HERE
</div>
<div style="background: url(http://i.imgur.com/UKVMkFY.png); border-radius: 0px 0px 10px 10px; height: 18px; margin-left: 5px; padding-bottom: 2px; width: 185px;">
</div>
</div>


Dashboard > Layout > Add a Gadget > HTML/JavaScript


Save. Mana mana code yang di-bold kan tu sila ubah mengikut kesusaian cbox korang okay? Sekian.

Bye o/

No comments:

Post a Comment

Template Designer. Full Edit by Hafiz Zulkafly. All Right Reserved.