Pages

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

Tidak ada komentar:

Posting Komentar