原本想用jQuery tools 來做menu，懶人法則，但是發現Joomla 已經用了mootools，因此用jQuery會有衝突，於是再尋找懶人法則，找到了個不錯的方法
首先上http://de.siteof.de/extended-menu.html 下載module，Extensions =>install & uninstall=> 選擇下載了的extended-menu，上載安裝
安裝成功後，入Extensions =>Module Manager，找到Extended Menu，進入設定，按下面設定
Menu Class Suffix： mainnav （這個名字是因為在javascript 時會用到）
Menu Style: Tree List
Expand Menu: Yes
Menu name：topmenu (其實就是選擇你要顯示的menu)
記得要Enabled這個module
儲存好後，接著把下面的css 複製到你的主題(template)的css 文件裡
css完成後，就可以加上下面的javascript放到 主題的index.php 的裡面
[code]
#twocols{ /*the columns that gets dropped down over yours might be different*/
z-index:20;
}
#leftcol{ /*the columns that gets dropped down over yours might be different*/
z-index:10;
}
.moduletablemainnav { /* I have absolutely positioned the module, you might have a different scheme*/
position:absolute;
top:187px;
left:20px;
z-index:100;
font:0.9em Verdana, Arial, Helvetica, sans-serif;
margin:0;
padding:0;
}
#mainlevelmainnav,#mainlevelmainnav ul {
float:left;
list-style:none;
line-height:1em;
background:transparent;
font-weight:700;
margin:0;
padding:0;
}
#mainlevelmainnav a {
display:block;
color:#f90;
text-decoration:none;
margin-right:15px;
padding:0.3em;
}
#mainlevelmainnav li {
float:left;
padding:0;
}
#mainlevelmainnav li ul {
position:absolute;
left:-999em;
height:auto;
width:11em;
font-weight:400;
background:#36f;
border:#00C 1px solid;
margin:0;
}
#mainlevelmainnav li li {
width:11em;
}
#mainlevelmainnav li ul a {
width:11em;
color:#fff;
font-size:0.9em;
line-height:1em;
font-weight:400;
}
#mainlevelmainnav li:hover ul ul,#mainlevelmainnav li:hover ul ul ul,#mainlevelmainnav li.sfhover ul ul,#mainlevelmainnav li.sfhover ul ul ul{
left:-999em;
}
#mainlevelmainnav li:hover ul,#mainlevelmainnav li li:hover ul,#mainlevelmainnav li li li:hover ul,#mainlevelmainnav li.sfhover
ul,#mainlevelmainnav li li.sfhover ul,#mainlevelmainnav li li li.sfhover ul {
left:auto;
z-index:6000;
}
#mainlevelmainnav li li:hover,#mainlevelmainnav li li.sfhover {
background:#039 url(../images/soccerball.gif) 98% 50% no-repeat;
}
[/code]
上面的getElementById裡面的mainlevelmainnav，就是剛才定的，前面mainlevel是系統的東西。
保存完畢後，就可以到主頁看看，css可以自己更改，這個很多網站都有提供配色，可以參考下。
