Tutorial :Hover Box #1


Hye..assalamualaikum..hihi....sye kembali lgi....dh lme x update tuto.....hihi.....okay tuto hri Hover box..thu x mcm mne...tuto ni direquest kat cbox...ok nak thu mcm mne...mcm bawah nie...



okay...dh tengok...mcm tu lah...nak thu mcm mne...JOM...

Template Designer

1. Dashboard > Design > Edit HTML

Template Classic/Blogskin

1.Dashboard > Template 

2.Tekan CTRL+f serentak cari kod nie : </style>

3.Copy kod nie : 

<style type="text/css">.box {width: 265px;padding: 10px;background:url(URL BACKGROUND);}.box2 {padding:3px;display:block;height:17px;width:255px;background:#fff;-webkit-transition-duration:.8s;-moz-transition-duration:.8s;overflow:hidden;}.box2:hover {height: 150px;}h01{font-family:consolas;padding-top:1px;font-size:12px;color:#000;text-align:center;text-transform :uppercase;background: pink;letter-spacing:5px;height:16px;padding-left:6px;display:block;-moz-transition: 0.5s;-webkit-transition: 0.5s;}</style><div class="box"><div class="box2"><h01>title</h01><div style="font-family:arial;font-size:8px;height:130px; overflow:auto;margin-top:3px;">you can put anything at here ngeee ~ whatever and ever. </div></div></div>

4.For Template designer pastekan kat bawah HTML/Javascript...For blogskin kat bawah </style> 


5.Preview & Save


Merah :URL BACKGROUND KORANG
Purple:Jenis tulisan
Biru:Ayat korang


No comments:

Post a Comment

Annyeong ^_^
Tinggalkan komen korang cini k :)
Amaran : NO HARSH WORDS !