Tutorial: Floating Menu Bar Jquery
Assalammualaikum. (=
hmm, Aind ade terima request dari kak michiko. dye nak buat Floating Menu Bar Jquery. ala, yang bile kite letak cursor kat situ, keluar perktaan tu. macam nie:
Ok, ni caranya: (perhatikan betul2 tau!)
3.copy n paste kod ni bawah ]]></b:skin> pulak k ?
4. copy n paste kod ni ats ]]></b:skin> .
5. copy n paste cod ni ats </body>
kene hati2 sikitlah sebab dye banyak code. kalau jadi korang gtau ea. kalau x jadi pun, gtau!
kbye✿
Ok, ni caranya: (perhatikan betul2 tau!)
1. Dashboard-design-edit HTML-tick expand widget
2. post kod ni BAWAH <head>
<script src='http://cikamoitutor.bravehost.com/jquery-1.4.2.min.js' type='text/javascript'/><script src='http://cikamoitutor.bravehost.com/jquery.easing.js' type='text/javascript'/><script src='http://cikamoitutor.bravehost.com/jquery.sweet-menu-1.0.js' type='text/javascript'/>
3.copy n paste kod ni bawah ]]></b:skin> pulak k ?
p/s: yang diboldkan bleh tukar pic yg korang suke!<script type='text/javascript'>$(document).ready(function(){$('#backMenu').sweetMenu({top: 40,padding: 8,iconSize: 48,easing: 'easeOutBounce',duration: 500,icons: ['images/back.png']});$('#exampleMenu').sweetMenu({top: 100,padding: 8,iconSize:40,easing: 'easeOutBounce',duration: 500,icons: ['http://1.bp.blogspot.com/-8HPX3cRbEv4/TWqAKubiMlI/AAAAAAAAD-M/3vIzpvJOzHo/s1600/2011-02-28_003024.png','http://1.bp.blogspot.com/-OE-a1ACRYvM/TWp-YDU4JAI/AAAAAAAAD98/AcK_uUbYiuU/s1600/Lockbox.png','http://3.bp.blogspot.com/-D-iRR9UIz5k/TWp-9to863I/AAAAAAAAD-E/0dSNTvNoZJQ/s1600/Text.png','http://1.bp.blogspot.com/-z-iw2XB4WUQ/TWqAK5_Z86I/AAAAAAAAD-U/mVSX7JI-1YY/s1600/Customize.png','http://2.bp.blogspot.com/-YtXFVHsn9Yk/TWqALDHN4mI/AAAAAAAAD-c/qM-XY5PrDgg/s1600/Sketches.png','http://3.bp.blogspot.com/-R9xU-Bj9Ye4/TWp9wCGKvKI/AAAAAAAAD90/U9jqZvY3ueA/s1600/Kate.png']});});</script>
4. copy n paste kod ni ats ]]></b:skin> .
.sweetMenuAnchor{border-top: 1px solid #ffffff;border-right: 1px solid #ffffff;border-bottom: 1px solid #ffffff;border-top-right-radius: 4px;-moz-border-radius-topright: 4px;border-bottom-right-radius: 4px;-moz-border-radius-bottomright: 4px;color: #000000;font-size: 20px;font-weight: bold;text-align: right;text-transform: uppercase;font-family: Arial Narrow;text-decoration: none;background-color: #ACF3FD;opacity: 1.0;}
.sweetMenuAnchor span{display: block;padding-top: 10px;}
5. copy n paste cod ni ats </body>
<div id='exampleMenu'>
<li><a expr:href='data:blog.homepageUrl' title='homepage'>Home</a></li><li><a href='LINK anda' target='_blank' >Tajuk1</a></li>
<li><a href='LINK anda' target='_blank' >tajuk2</a></li>
<li><a href='LINK anda' target='_blank' >tajuk3</a></li>
<li><a href='LINK anda' target='_blank' >tajuk4</a></li>
<li><a href='LINK anda' target='_blank' >tajuk5</a></li>
</div>
kene hati2 sikitlah sebab dye banyak code. kalau jadi korang gtau ea. kalau x jadi pun, gtau!
kbye✿
Ulasan