相信对于菜单比较关注的小伙伴之前应该都了解谢老板的这个教程
侧边菜单栏的一种处理方式
https://gcdn.grapecity.com.cn/fo ... 2&fromuid=51381
(出处: 葡萄城产品技术社区)
可以实现在活字格页面中滑动显示隐藏菜单的效果，不过这个功能在7.0版本之后，失效了，失效了，失效了~
原因是7.0我们使用了grid布局，很多以前CSS或者JS操作的DOM会发生变化
问题我们发现了，相应的我们也会有对应的解决方案
7.0的发布，让这个功能更加的简单，不需要使用JS代码，只需要CSS就可以控制我们相应的效果
我们先看下效果
实现如下：
1.在母版页中添加菜单，不需要隐藏菜单显示区域
2.在浏览器中获取菜单单元格的id，运行浏览器，F12打开调试控制台
3.当拿到对应菜单的ID之后，就可以通过CSS分分钟解决了
- #r4c0m_outerdiv{
- width:10px !important;
- opacity: 0;
- -webkit-transition: all 0.3s ease-in;
- }
- #r4c0m_outerdiv:hover{
- width:100% !important;
- max-width:200px;
- opacity: 1;
- grid-column-end:32 !important;
- -ms-grid-column-span:31 !important;
- z-index:999;
- }
详细工程文件见附件
滑动显示左侧菜单.fgcc
(886.09 KB, 下载次数: 448)
|
陕公网安备：61019002000258 |
隐私政策 |
网站地图