javascript - Google+菜单项选中效果问题?
迷茫
迷茫 2017-04-11 13:33:06
[JavaScript讨论组]

想实现类似于google+页面上的效果,先上图

如图,选中Home页面的时候,下面菜单项的Home这一项会变成红色;选中Collections一项时,下面菜单项的Collections会变成蓝色,显然每个菜单项都有对应的主题色。

我当然可以每个菜单项都赋个id或css类,然后写N个if或switch...case判断之类的,但显然google不会这么干。那请问有没有更好的实现思路?

谢谢~

迷茫
迷茫

业精于勤,荒于嬉;行成于思,毁于随。

全部回复(3)
迷茫

图片看不到。

高洛峰

如果每个都不一样的话。肯定是独立写了样式了

天蓬老师

如果不是单页面的, 页面url一般有菜单的参数,则菜单项的 样式类就定义 当前参数的名字就好了

如果是单页面的, 那也差不多,在菜单上定义一个属性 attr: classname="collection",点击后把菜单项的类改成这个 属性名字就可以了。

如果是用了框架,则双向绑定数据,实现类名的更改

基本上应该不用写 N个if 语句

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号