Monday 12 March 2012

Floating Youtube (Part 1)

Assalammualaikum
Smiley ^_^

Nak buat juga ke ? Buat apa ? Kau lagi ! Yang tu kita tolak ke tepi. Aku tanya kau tadi. Buat apa ? Buat ni.

BEFORE

AFTER

Mohd yang tanya. 


Nurul tak pasti sama ada menjadi atau tidak untuk template yang lain. Yang Nurul pasti ,
Template Denim je sesuai. Kalau tak menjadi , template korang memang tak sesuai.

  •  Design > Edit Html > F3 > search 
]]></b:skin>
  •  Copy and paste kat ATAS code tu.
.music {
padding:12px;
border-bottom-right-radius:5px;
background:#ffffff;
}
#ytube {
text-align: center;
position:fixed;
left:43px;
top:-55px;
-webkit-transition: all .5s ease-in-out;
-moz-transition: all .5s ease-in-out;
-0-transition: all .5s ease-in-out;
z-index:999;
}
#ytube:hover {
top:-10px;
}
#pict {
height:35px;
background: #ffffff;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
width: 50px;
align:center;
}

  •  Preview and Save.
  •  Page Elements > Add A Gadget >  HTML/Javascript
  •  Copy and paste code ni kat HTML/Javascript
<div id="ytube">
<div class="music">
Code youtube korang
</div>
<div id="pict"><br/><img src="Code icon comel korang" />
</div></div>
ABC : Ubahlah jika korang rasa tak sesuai
ABC : background
ABC : Code youtube koranglah. Tak tahu nak letak ? Tengok sini
ABC : letak icon comel

http://sl.glitter-graphics.net/pub/439/439087zf2mcug0by.gif
 http://sl.glitter-graphics.net/pub/122/122842r9l2jjtjaf.gif
http://dl5.glitter-graphics.net/pub/220/220645u9r9sjvsfp.gif




m
e
s
s
a
g
e

 
This blog+author+design fully edited and the designer is Nurul. Don't steal my design !