站长百科 | 数字化技能提升教程 数字化时代生存宝典
首页
数字化百科
电子书
▼
建站程序
开发
服务器
办公软件
开发教程
▼
服务器教程
软件使用教程
运营教程
热门电子书
▼
CSS教程
WordPress教程
导航
程序频道
推广频道
网赚频道
人物频道
网站程序
网页制作
云计算
服务器
CMS
论坛
网店
虚拟主机
cPanel
网址导航
WIKI使用导航
WIKI首页
热点词条
最新资讯
网站程序
站长人物
页面分类
使用帮助
编辑测试
创建条目
网站地图
站长百科导航
站长百科
主机侦探
IDCtalk云说
跨境电商导航
WordPress啦
站长专题
网站推广
网站程序
网站赚钱
虚拟主机
cPanel
网址导航专题
云计算
微博营销
虚拟主机管理系统
开放平台
WIKI程序与应用
美国十大主机
编辑“
Joomla/用JA Transmenu模块做多级弹出菜单
”(章节)
人物百科
|
营销百科
|
网赚百科
|
站长工具
|
网站程序
|
域名主机
|
互联网公司
|
分类索引
跳转至:
导航
、
搜索
警告:
您没有登录。如果您做出任意编辑,您的IP地址将会公开可见。如果您
登录
或
创建
一个账户,您的编辑将归属于您的用户名,且将享受其他好处。
反垃圾检查。
不要
加入这个!
==自定义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行,找到: a.mainlevel-trans:link, a.mainlevel-trans:visited { 将其修改为: a.mainlevel-trans:link, a.mainlevel-trans:visited, .mainlevel-trans { 这样就等于给“占位符”定义了与其他同级可点击链接相同的外观。 这时,在前台可以看到“占位符”类型的菜单项目也有了相同的字号、字体、颜色和背景色。但是,当我们把鼠标指向这个“占位符”类型的菜单项目时,就露出了马脚:鼠标没有变成一只手的样子,而是普通的“I”光标符号。由于大多数人已经习惯了鼠标指向菜单时必然是手形符号,那么现在这种情况就容易让访客感到沮丧。 Ok,好在CSS也能伪装这一点。在上面修改的代码下面一行,插入一句: cursor: hand; 这句代码意思是只要鼠标进入菜单区域,就一直显示手形外观。 还有一处需要修改,因为如果将一级菜单设置为“占位符”类型,则点击其二级菜单之后,一级菜单成了“当前菜单”(active menu),这时该一级菜单的外观又不那么美观了。 修改方法是在CSS文件中140行左右,找到: a.mainlevel_active-trans, a.mainlevel_active-trans:visited { 修改为: a.mainlevel_active-trans, a.mainlevel_active-trans:visited, span.mainlevel_active-trans{ 这是因为“占位符”型的一级菜单项目不是链接(a),而是span。
摘要:
请注意,您对站长百科的所有贡献都可能被其他贡献者编辑,修改或删除。如果您不希望您的文字被任意修改和再散布,请不要提交。
您同时也要向我们保证您所提交的内容是您自己所作,或得自一个不受版权保护或相似自由的来源(参阅
Wordpress-mediawiki:版权
的细节)。
未经许可,请勿提交受版权保护的作品!
取消
编辑帮助
(在新窗口中打开)