Vertical Menu Tab

بِسْمِ اللهِ الرَّحْمنِ الرَّحِيمِ
hyee readers.....okkk..sekrg..ery nk wat tutoo lah pulakk!! td freebiess....jum..tuto pulak lahh yeee..ehehehe....okkk....hari ni..kita nk buat macam mne nk buat tutorial vertical menu tab..ehehehe..jummm kite tryy!!ikut step di bwhh !! :D

1.DASHBOARD >> DESIGN >> ADD GADGET >> HTML JAVASCRIPT2.coding kat bwh ni..mmg laa pnjang...ehehe.copy code kat bawah...then..pastekan kat dalam ruangan html javascript tu ..:)

<style type="text/css">

/*Credits: Dynamic Drive CSS Library */

/*URL: http://www.dynamicdrive.com/style/ */

.sidebarmenu ul{

width:280;

text align:center;

list-style-type: none;

font: normal 13px Century gothic;

}

.sidebarmenu ul li{

position: relative;

}

/* Top level menu links style */

.sidebarmenu ul li a{

display: block;

overflow: auto; /*force hasLayout in IE7 */

color: white;

text-align:center;

text-decoration: none;

padding: 0px;

}

.sidebarmenu ul li a:link, .sidebarmenu ul li a:visited, .sidebarmenu ul li a:active{

background-color: #000000; /*background of tabs (default state)*/}

.sidebarmenu ul li a:visited{

color: white;}

.sidebarmenu ul li a:hover{

background-color: #FFFFFF;}

/* Holly Hack for IE \*/

* html .sidebarmenu ul li { float: left; height: 1%; }

* html .sidebarmenu ul li a { height: 1%; }

/* End */

</style>

<script type="text/javascript">

//Nested Side Bar Menu (Mar 20th, 09)

//By Dynamic Drive: http://www.dynamicdrive.com/style/

var menuids=["sidebarmenu1"] //Enter id(s) of each Side Bar Menu's main UL, separated by commas

function initsidebarmenu(){

for (var i=0; i<menuids.length; i++){

  var ultags=document.getElementById(menuids[i]).getElementsByTagName("ul")

    for (var t=0; t<ultags.length; t++){

    ultags[t].parentNode.getElementsByTagName("a")[0].className+=" subfolderstyle"

  if (ultags[t].parentNode.parentNode.id==menuids[i]) //if this is a first level submenu

   ultags[t].style.left=ultags[t].parentNode.offsetWidth+"px" //dynamically position first level submenus to be width of main menu item

  else //else if this is a sub level submenu (ul)

    ultags[t].style.left=ultags[t-1].getElementsByTagName("a")[0].offsetWidth+"px" //position menu to the right of menu item that activated it

    ultags[t].parentNode.onmouseover=function(){

    this.getElementsByTagName("ul")[0].style.display="block"

    }

    ultags[t].parentNode.onmouseout=function(){

    this.getElementsByTagName("ul")[0].style.display="none"

    }

    }

  for (var t=ultags.length-1; t>-1; t--){ //loop through all sub menus again, and use "display:none" to hide menus (to prevent possible page scrollbars

  ultags[t].style.visibility="visible"

  ultags[t].style.display="none"

  }

  }

}

if (window.addEventListener)

window.addEventListener("load", initsidebarmenu, false)

else if (window.attachEvent)

window.attachEvent("onload", initsidebarmenu)

</script>

<div class="sidebarmenu">

<ul id="sidebarmenu1">

<li><a href="LINK ANDA">TAJUK TAB</a></li>

<li><a href="LINK AMDA">TAJUK TAB</a></li>

<li><a href="LINK ANDA">TAJUK TAB</a></li>

<li><a href="LINK ANDA">TAJUK TAB</a></li>

</ul>

</div></center></center>

OKK...ehehehe..pastekan semuanyee dlm ruangan html javascript...mmg pnjg.ehehe..kalau tak fhm ape2..tnya ery okk..ehehehe.....:))

=SELAMAT MENCUBA=

---

thanks coz visit to this entry#ilapusomuch#

---