前两个参数都是关于CSS的，为了便于用户自定义菜单的样式。我们先从浅处入手，不必理会这里。

“菜单名称”这里需要管理员指定用JA Transmenu来展示哪个菜单模块，因为它无法包揽所有菜单。我们本例中就指定使用topmenu吧，因为刚才我们为topmenu建立了多级菜单链接。

“菜单类型”是要管理员决定，前台的滑动菜单其一级菜单是水平放置，还是垂直放置？比如本例中的topmenu，我们一般都是习惯于水平放置，因此在这里选择“水平”即可。

“菜单方向”则是指二级菜单的弹出方向，不要管三级、四级，因为那些默认都是水平的。二级菜单需要指定方向，是因为一级菜单的方向有两种可能。既然我们将一级菜单设计成了“水平”，那么二级菜单应该是在垂直方向上。这里有两种选项：向上或者向下。很显然，一般来说，我们希望二级菜单向下弹出，就如同本文第一页展示的那个菜单。不过，也难免某些用户希望出现Windows的开始菜单那样的效果，那么你选择“向上”即可。

“菜单相对位置”是指二级以下的菜单弹出方向。因为前面的参数已经把一级、二级菜单方向都定义了。所以，我们希望三级菜单从哪里弹出来就选择哪个方向。在本例中，三级菜单是从二级菜单的右侧弹出的；又由于我希望一、二、三级菜单显示一个逐级下降的外观，所以我选择了“右下”方向。

“显示菜单图标”这个是指提示存在下级菜单的那个图标。在本例中就是二级菜单上“Joomla之门”右侧那两个白色大于号（>>），这个图标提示该项目存在下级菜单。如果你不想显示，选择“否”即可。

“菜单图标位置”说的是上一条中那个图标显示在什么位置。一般来说，当然是显示在下级菜单弹出的位置。本例中下级菜单从右侧弹出，因此我选择让这个小图标显示在右侧。当然了，如果你在上一条中选择了“否”，这一条的设置就没有意义。

“上端位置”和“左侧位置”这两条是专门限定二级菜单的相对位置的。由于JA Transmenu使用了Javascript来实现滑动效果，因此在某些网站的模板中可能出现奇怪现象：就是二级菜单弹出的位置距离其父级菜单项目有一定距离。那么我们就可以通过这两个参数来调整。这里只能填写整数数字，不需要填写单位，默认为“像素”（pixel）。如果你想要将二级菜单向右移动，“左侧位置”就填写正整数；如果需要向下移动，“上端位置”就填写正整数。如果需要向左、向上移动呢？分别填写负整数即可，如“左侧位置”填 -200 ，就表示二级菜单向左移动200像素。在实际应用中，是否需要移动，移动多少，需要用户在前台观看效果，刷新页面，进行调整。

“下级菜单水平留白”和“下级菜单垂直留白”分别指三级以后的菜单在弹出时其顶端距离父级菜单右上角的水平和垂直距离。例如，在本例中，我需要三级菜单紧贴二级菜单右侧，因此我将“下级菜单水平留白”设为“1”（单位：像素）；我希望三级菜单弹出时略低于其父级菜单，因此我将“下级菜单垂直留白”设为5。

设置完成后，将此模块发布到原来展示topmenu的模块位置，然后刷新前台页面，就应该看到滑动菜单的效果了。

4、自定义JA Transmenu滑动菜单的样式

细心的读者可能已经发现，上述参数中没有针对滑动菜单的字体、颜色、背景等等作出定义。难道所有JA Transmenu的用户都使用同一个效果吗？当然不是。

按理来说，这些设置也应该出现在后台参数中，这样更符合Joomla的操作习惯，也方便用户自定义菜单外观。可是，该模块的作者，JoomlArt团队正在忙着制作、销售专业模板，根本没有计划改进这个模块。所以，我们就自己动手吧。

我们要用到三个文件：transmenu.js、transmenuh.css或transmenuv.css。在安装之后，它们位于 /modules/ja_transmenu/ 目录中。我之所以用“或”，是因为后面两个文件只用一个。具体哪一个取决于你所定义的一级菜单的方向，即后台参数中“菜单类型”，如果是“水平”，就用前者；“垂直”则用后者。这两个文件名末尾的h和v已经说明了这一点。

在transmenu.js这个文件的第45行，我们只设定一个内容：TransMenu.backgroundColor，它表示次级菜单的背景颜色。其余样式均在CSS文件中。

在本例中，我们设定了前台菜单为“水平”，因此我们打开transmenuh.css这个文件，逐个设置菜单的字体、颜色、背景、透明度、鼠标指向时的颜色变化、点击之后的链接颜色等等。我在transmenuh.css这个文件中用中文解释了部分代码的含义，transmenuv.css这个文件没有注释，不过我相信大同小异。请各位会员自己按照需要调整吧。

如果你建立了一个类型为“占位符”的一级菜单项，以强制访客点击二级菜单，那么你会发现该占位符的外观与其他同级菜单链接迥然不同，非常难看。既然是外观，那么就可以通过CSS来修改：打开 /modules/ja_transmenu/ 文件夹里面的transmenuh.css（如果是垂直菜单则为transmenuv.css），大约在116行，找到：

将其修改为：

这样就等于给“占位符”定义了与其他同级可点击链接相同的外观。

这时，在前台可以看到“占位符”类型的菜单项目也有了相同的字号、字体、颜色和背景色。但是，当我们把鼠标指向这个“占位符”类型的菜单项目时，就露出了马脚：鼠标没有变成一只手的样子，而是普通的“I”光标符号。由于大多数人已经习惯了鼠标指向菜单时必然是手形符号，那么现在这种情况就容易让访客感到沮丧。

Ok，好在CSS也能伪装这一点。在上面修改的代码下面一行，插入一句：

这句代码意思是只要鼠标进入菜单区域，就一直显示手形外观。你可以在我正在建设的一个新网站 http://www.spinechina.org 上面看看这个效果。

还有一处需要修改，因为如果将一级菜单设置为“占位符”类型，则点击其二级菜单之后，一级菜单成了“当前菜单”（active menu），这时该一级菜单的外观又不那么美观了。

修改方法是在CSS文件中140行左右，找到：

修改为：

这是因为“占位符”型的一级菜单项目不是链接（a），而是span。

如果还发现其他外观问题，我相信都可以在CSS文件中得到改善。这里不能一一列举，有关CSS知识可以参考《CSS权威指南》PDF中文版 。

如果你使用了其他滑动菜单模块，一样可以通过CSS来使得“占位符”型菜单链接看起来与正常链接没什么区别。或许CSS语句不通，但是道理相同，所谓“触类旁通”，各位看官自己摸索吧。

5、JA Transmenu的缺点

这个滑动菜单模块也不是完美的。最重要一点就是：在每个网站只能为一个菜单模块实现滑动效果。如果我们既要在topmenu实现多级滑动，又要在mainmenu实现多级滑动，那么这个模块做不到。即使我们通过模块列表上的“Copy”按钮可以复制一份，但是我们无法复制 /modules/ja_transmenu/ 这个目录。当然了，如果高手从代码修改起，或许可以制作出一个复制件，但这已经远远超出了我这个菜鸟的能力范围，留待高人讲解吧。