脚本分享ABI门户导航栏树滚动条样式

复制链接 | 收藏本帖

2968

楼主

一、滚动条样式介绍
滚动条组成元素以及css样式介绍可以看这个帖子https://bbs.esensoft.com/thread-137839-1-1.html

二、操作详情
门户中添加脚本的入口在这里

根据不同风格门户增加样式定位的类名也是不一样的，以梦星蓝，多彩菜单栏风格门户的代码如下

EUI.addStyleSheet(".xtabctrl.eui-tabctrl-default.eui-tabctrl-container.eui-tabctrl-greenelf.container_layout_flow ::-webkit-scrollbar-thumb{background-color:red!important;}");

复制代码

.xtabctrl.eui-tabctrl-default.eui-tabctrl-container.eui-tabctrl-greenelf.container_layout_flow是通过f12拾取到树类名找到的

浅葱tab页门户代码是

EUI.addStyleSheet(".eui-tree-container.eui-tree-container-seablue::-webkit-scrollbar-thumb{background-color:red!important;}");

复制代码

.eui-tree-container.eui-tree-container-seablue也是通过拾取f12找到的

其实可以发现它们有共同的类cell_container，所以可以直接用以下代码做，这个能适应大部分风格门户。
（因为其他元素也会有这个类，因此给cell_container增加滚动条样式可能会影响其他元素，建议在不能正确拾取导航树或门户中元素较少影响少的时候用。）

EUI.addStyleSheet("div.cell_container ::-webkit-scrollbar-thumb{background-color:red!important;}");

复制代码

QQ空间微信

登录后可回答问题，请登录或注册

我要发帖

亿信社区