Kod:
-----------------------------------------------------------------Tasarım Üstüne-------------------------------------------------------------</p>
<p> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script></p>
<p><script type="text/javascript" src="http://sado.voovq.com/js/ddaccordion.js"></p>
<p>/***********************************************
* Bu Menü Catlak-site55 Tarafından Düzenlenmiştir *
***********************************************/
</script><script type="text/javascript"></p>
<p>ddaccordion.init({
headerclass: "expandable", //Shared CSS class name of headers group that are expandable
contentclass: "categoryitems", //Shared CSS class name of contents group
revealtype: "click", //Reveal content when user clicks or onmouseover the header? Valid value: "click", "clickgo", or "mouseover"
mouseoverdelay: 200, //if revealtype="mouseover", set delay in milliseconds before header expands onMouseover
collapseprev: true, //Collapse previous content (so only one open at any time)? true/false
defaultexpanded: [0], //index of content(s) open by default [index1, index2, etc]. [] denotes no content
onemustopen: false, //Specify whether at least one header should be open always (so never all headers closed)
animatedefault: false, //Should contents open by default be animated into view?
persiststate: true, //persist state of opened contents within browser session?
toggleclass: ["", "openheader"], //Two CSS classes to be applied to the header when it's collapsed and expanded, respectively ["class1", "class2"]
togglehtml: ["prefix", "", ""], //Additional HTML added to the header when it's collapsed and expanded, respectively ["position", "html1", "html2"] (see docs)
animatespeed: "fast", //speed of animation: integer in milliseconds (ie: 200), or keywords "fast", "normal", or "slow"
oninit:function(headers, expandedindices){ //custom code to run when headers have initalized
//do nothing
},
onopenclose:function(header, index, state, isuseractivated){ //custom code to run whenever a header is opened or closed
//do nothing
}
})</p>
<p></script></p>
<p>-------------------------------------------------------------Tasarım Üstü Bitiş---------------------------------------------------------------------------</p>
<p>----------------------------------------------------Menüyü Göstermek İstediginiz Yer----------------------------------------------------------</p>
<div class="arrowlistmenu">
<h3 class="menuheader expandable">BURAYA MENÜ ADI</h3>
<ul class="categoryitems">
<li><a href="LİNK">Buraya Sayfa Adı</a></li>
<li><a href="LİNK">Buraya Sayfa Adı</a></li>
<li><a href="LİNK">Buraya Sayfa Adı</a></li>
<li><a href="LİNK">Buraya Sayfa Adı</a></li>
<li><a href="LİNK">Buraya Sayfa Adı</a></li>
<li><a href="LİNK">Buraya Sayfa Adı</a></li>
</ul>
<h3 class="menuheader expandable">BURAYA MENÜ ADI</h3>
<ul class="categoryitems">
<li><a href="LİNK">Buraya Sayfa Adı</a></li>
<li><a href="LİNK">Buraya Sayfa Adı</a></li>
<li><a href="LİNK">Buraya Sayfa Adı</a></li>
<li><a href="LİNK">Buraya Sayfa Adı</a></li>
<li><a href="LİNK">Buraya Sayfa Adı</a></li>
<li><a href="LİNK">Buraya Sayfa Adı</a></li>
</ul>
<h3 class="menuheader expandable">BURAYA MENÜ ADI</h3>
<ul class="categoryitems">
<li><a href="LİNK">Buraya Sayfa Adı</a></li>
<li><a href="LİNK">Buraya Sayfa Adı</a></li>
<li><a href="LİNK">Buraya Sayfa Adı</a></li>
<li><a href="LİNK">Buraya Sayfa Adı</a></li>
<li><a href="LİNK">Buraya Sayfa Adı</a></li>
<li><a href="LİNK">Buraya Sayfa Adı</a></li>
</ul>
</div>
<p>--------------------------------------------------Menüyü Göstermek İstediginiz Yer Bitiş--------------------------------------------------</p>
<p>-----------------------------------------------------------------Css Kodu--------------------------------------------------------------------------------<br />
.arrowlistmenu{<br />
width: 194px;<br />
}</p>
<p>.arrowlistmenu .menuheader{<br />
font: bold 14px Arial;<br />
color: white;<br />
background: black url(http://img.webme.com/pic/c/catlak-site55/titlebar.png) repeat-x center left;<br />
margin-bottom: 10px;<br />
text-transform: uppercase;<br />
padding: 4px 0 4px 4px;<br />
cursor: hand;<br />
cursor: pointer;<br />
}</p>
<p>.arrowlistmenu .openheader{<br />
background-image: url(http://img.webme.com/pic/c/catlak-site55/titlebar-active.png);<br />
}</p>
<p>.arrowlistmenu ul{<br />
list-style-type: none;<br />
margin: 0;<br />
padding: 0;<br />
margin-bottom: 8px;<br />
}</p>
<p>.arrowlistmenu ul li{<br />
padding-bottom: 2px;<br />
}</p>
<p>.arrowlistmenu ul li a{<br />
color: #A70303;<br />
background: url(http://img.webme.com/pic/c/catlak-site55/arrowbullet.png) no-repeat center left;<br />
display: block;<br />
padding: 2px 0;<br />
padding-left: 19px;<br />
text-decoration: none;<br />
font-weight: bold;<br />
border-bottom: 1px solid #dadada;<br />
font-size: 90%;<br />
}</p>
<p>.arrowlistmenu ul li a:visited{<br />
color: #A70303;<br />
}</p>
<p>.arrowlistmenu ul li a:hover{<br />
color: white;<br />
background-color: black;<br />
}</p>
------------------------------------------Css Kodu Bitiş--------------------------------------
<p>Eger Css Tasarım Kullanmıyorsanız Css Kodunu<br />
<style type="text/css"> Buraya Css Kodu </style>
<p> Tagı Arasına Koyup Tasarıma Ekleyin.....</p>
<p>