layui导航栏鼠标经过青色条块怎么移到顶部?

layui导航栏鼠标经过青色条块怎么移到顶部?

layui-nav-bar怎么移到导航栏的顶部?

青色条块其实就是在鼠标经过时会变成,所以,如果我们把top:111px变成top:0,青色条块就可以移到顶部了。

图示:

1,菜单栏加载最初状态(浏览器按f12打开调试框),可以看到在菜单栏最后面
在这里插入图片描述

2,鼠标经过菜单,发现变成,所以我们只需要把top:111px改成top:0,就可以了。由于是通过js控制实现的,所以我们只需要修改layui\lay\modules\element.js就可以实现了。
from clipboard
3,修改layui\lay\modules\element.js,

搜索top:c.position().top+c.height()-l.height()改为top:0

再次打开浏览器预览,发现条块跑到了顶部。

company下面的条块在底部,怎么回事?这是菜单的选中状态,需要修改css,

打开layui.css,找到.layui-nav .layui-this:after{content:’’;top:auto;bottom:0;width:100%}

把top:auto改为top:0就可以了,不要直接修改layui.css,可以自己写css覆盖layui.css的设置,然后就ok了
from clipboard
转载自http://taotaoit.com/article/details/910.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值