(Special 30 Followers) Tutorial Membuat Floating Cbox

Credit: Neira

Login to blogger << dasbor

 Tata Letak << nah, ada beberapa macam pilihan, bukan? YEP! Pilih HTML Javasxript

 Setelah itu, copy kode ini

<style>
#chatme{
position:fixed; top:5px; left:5px;
padding-top:5px;padding-bottom:17px;
text-align:center;
height:20px; width:95px;
overflow:hidden;
border:3px Dashed #F9B5CC;
color:#888;
border-radius:40px;
-webkit-transition: opacity 0.7s linear;
-webkit-transition: all 0.7s ease-in-out;
-moz-transition: all 0.7s ease-in-out;
-o-transition: all 0.7s ease-in-out;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEieYpnKlPhsGxd4GnyEBI0A5diADCmKKnONfIzcJcJ5QrpcAKly2e9MbHoDxh6dN_-cplOmIu5Wu13NLQNHs7G-51gv0q6M0a2z7-9afH8DMtmLRnCWulMIhehjtV161MleSHtrx4SwI7cG/s1600/background13.png);
z-index:999;
}
#chatmelive{
padding-top:10px;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
} #chatme:hover {
border:3px dotted pink; padding:5px; height:450px; width:280px;
border-radius:40px;
}
</style>
<div id="chatme">
<center>
<img src="ICON CHAT" style="background:none;border:none;padding-top:0px;" /></center>
<div id="chatmelive">
KODE CBOX</div>

 Paste di kotak HTML

 Save!

Keterangan Warna:

Biru: Icon chat

Biru: Kode chatbox