Minggu, 13 Oktober 2013

Menempatkan Hover Over banner link didalam blog

copy paste code berikut ini, letakkan diruangan html/javascript
save dan lihat hasilnya

semoga berhasil

<style>

#bannerdiv {

    z-index: 9999;

    position: fixed;

    bottom: -300px;

    right: 20px;

    -webkit-transition: all 1s ease-in-out;

    -moz-transition: all 1s ease-in-out;

    -o-transition: all 1s ease-in-out;

    transition: all 1s ease-in-out;

    background-color: #000000;

padding: 5px;

margin: 4px;

border-radius: 10px 10px 0px 0px;

}

#bannerdiv:hover {

    bottom: -5px;

}

#bannertitle {

    text-align: center;

    font-size: 11px;

    font-family: verdana;

    letter-spacing: 1px;

    color: #ffffff;

    padding: 3px 5px 15px 5px;

    border-top-left-radius: 10px;

    border-top-right-radius: 10px;

}

 </style>




<br />

<div id="bannerdiv">

<div id="bannertitle">

GIVEAWAY</div>

<center>

<a href="LINK ANDA"><img height="70" src="http://icons.iconarchive.com/icons/tanitakawkaw/simple-cute/128/box-icon.png" width="70" /></a></center>

<center>

<a href="LINK ANDA"><img height="70" src="http://icons.iconarchive.com/icons/double-j-design/ravenna-3d/128/Box-icon.png" width="70" /></a></center>

<center>

<a href="LINK ANDA"><img height="70" src="http://icons.iconarchive.com/icons/petalart/free-shopping/128/shipping-box-icon.png" width="70" /></a></center>

<center>

<a href="LINK ANDA"><img height="70" src="http://icons.iconarchive.com/icons/mymovingreviews/3d-movers/128/boxes-brown-icon.png" width="70" /></a></center>

</div>

Tidak ada komentar:

Posting Komentar

Catatan: Hanya anggota dari blog ini yang dapat mengirim komentar.