Jumat, 20 Maret 2015

Cara Membuat Status Box Tersembunyi

Assakamualaikum Wr.Wb
Hai Teman Teman Ada yang tanya nih..
 
Bagi Teman Teman lain yang mau langsung Lihat aja yuk!
Classic Template :
  • Letakkan kode di Html/JavaScript
Blogskin :
  • Letakkan kode status box di atas kode </style>

Codes :
<style>
.y{
border-radius: 0px 15px 15px 0px;
width:10px;
padding:10px;
height:25px;
margin-top:30px;
margin-left:255px;
background: #faafbe;
color:white;
font-size:12px;
-webkit-transition: 1.0s;
-moz-transition: 1.0s;
}
#kotakstatus {
position:fixed;
border:4px solid #faafbe;
width:250px;
left:-265px;
top:50px;
height:100px;
padding:4px;
text-align:left;
font-size:11px;
font-family:arial;
background-color:white;
background-image:url(URL BACKGROUND);
background-position:right;
color:#333333;
-webkit-transition: 1.0s;
-moz-transition: 1.0s;
}
#kotakstatus:hover {
left:1px;
}
</style>
<div id="kotakstatus"><div class="y">
s</div>
<div style="margin-top: -80px;"><br>
PUT STATUS HERE</div></div>
    Adjust code :
- Merah : kode warna border status box.
- Oranye : kode warna huruf "s".
- Ungu : Url background.
- Pink : kode warna font status box
- Biru : gantikan dengan status-mu :)
 
Sudah dulu ya.. 
Wassalamualaikum Wr.Wb

0 komentar:

 

Karya Rani Published @ 2014 by Ipietoon