`
ganjuelovejava
  • 浏览: 91934 次
  • 性别: Icon_minigender_2
  • 来自: 湖南
社区版块
存档分类
最新评论

jstree 节点图片样式区别

阅读更多
修改前
.jstree-default .jstree-open > ins { background-position:-72px 0; }
.jstree-default .jstree-closed > ins { background-position:-54px 0; }
.jstree-default .jstree-leaf > ins { background-position:-36px 0; }

.jstree-default .jstree-hovered { background:#e7f4f9; border:1px solid #d8f0fa; padding:0 2px 0 1px; }
.jstree-default .jstree-clicked { background:#beebff; border:1px solid #99defd; padding:0 2px 0 1px; }
.jstree-default a .jstree-icon { background-position:-56px -19px; }
.jstree-default a.jstree-loading .jstree-icon { background:url("throbber.gif") center center no-repeat !important; }

.jstree-default.jstree-focused { background:#ffffee; }

修改后
/*展开合并加减样式 IE8*/
.jstree-default .jstree-open > ins { background-position:-72px 0 ;}
.jstree-default .jstree-closed > ins { background-position:-54px 0;}
.jstree-default .jstree-leaf > ins { background-position:-36px 0; }

.jstree-default .jstree-hovered { background:#e7f4f9; border:1px solid #d8f0fa; padding:0 2px 0 1px; }
.jstree-default .jstree-clicked { background:#beebff; border:1px solid #99defd; padding:0 2px 0 1px; }


.jstree-default a .jstree-icon { background-position:-76px -34px; padding-top:2px;}

/*叶子节点的样式*/
.jstree-default a .jstree-icons { background-position:-76px -34px; padding-top: 2px;}

/*叶子节点样式
.jstree-default li > ul > li > a .jstree-icon { background-position:-76px -34px; }*/

/*书展开样式*/
.jstree-default .jstree-open > a .jstree-icon { background-position:-56px -36px; }
.jstree-default a.jstree-loading .jstree-icon { background:url("throbber.gif") center center no-repeat !important; }
/*书合并样式*/
.jstree-default .jstree-closed > a .jstree-icon { background-position:-56px -16px; padding-top:2px;}

.jstree-default.jstree-focused { background:#ffffee; }
分享到:
评论

相关推荐

    好看的树样式tree

    js可折叠树样式,用于显示分组列表,使用js简单的封装,方便使用

    vued3treeVUE实现自定义节点的树结构

    vued3treeVUE实现自定义节点的树结构

    树的动态加载及节点维护

    通过树实现动态加载以及实现添加节点、删除节点、修改节点文本已经通过拖动移动节点等功能。先创建树的表结构:插入以下数据:首先创建基本页面:代码中已包含了样式、ExtJS的脚本文件和语言包。其实bootstrap.js会...

    ztree根据文本内筛选叶子节,并改变叶子节点字体颜色

    ztree根据文本内筛选叶子节,并改变叶子节点字体颜色,注意例子不是bak备份html,含Ztree需要的js控件。

    d3-org-tree:使用d3.js v5构建的高度可定制的组织树

    自定义节点样式,包括svg和通过template纯HTML dom 自定义节点行为,包括expand子节点, add子节点并delete它 自定义当前节点的highlight样式,并可以手动更改当前节点 预设或动态更改布局orientation ,链接样式...

    左树节点动态拖到右侧面板

    js+ztree 实现左侧树将节点拖到右侧面板,动态加载div,动态加载样式

    javascript 树控件 比较好用

    QooXdoo Tree Widget是一款OOP风格的js树控件,它支持自由扩展树控件的样式,比如做成跟文件系统一样的风格,还支持动态添加子节点、键盘导航。   3.jsTree jstree兼容多个浏览器,它有诸多跟extjs TreePanels...

    dtree树型控件(纯js)

     - Alternative images for each node(每个节点用图片代替) [编辑本段]创建dtree  1)从官网上下载dtree的源文件压缩包“dtree.zip”,包内包含以下几个文件:  img文件夹: 包含树形菜单显示需要的图标  api....

    ztree实现左边动态生成树右边为内容详情功能

    支持多种事件响应及反馈 支持 Tree 的节点移动、编辑、删除 支持任意更换皮肤 / 个性化图标(依靠css) 。 页面原型图: 功能需求:点击左边树上的子节点,像后台发送请求,将请求到的信息展示在右边的表单里面 ...

    combox 控件

    该下拉框使用JS进行渲染。下拉框样式如下: 该外观是由CSS和图片控制。通过修改CSS可以很方便地实现更改外观。 QUI树形下拉框不存在IE6中无法被浮动层遮住等问题。 特点2:使用简单 引入脚本和相应的CSS之后...

    ExtAspNet_v2.3.2_dll

    -增加示例(data/tree_select_run.aspx),如何选中当前节点的所有子节点(feedback:wjl_wjl520)。 +TreeNode的属性NodeId被重命名为NodeID,这是ExtAspNet中的一个命名约定。 -同时更名的还有GridColumn的...

    精通JS脚本之ExtJS框架.part1.rar

    10.11 树形节点视图——Ext.tree.TreeNodeUI 10.12 表格与树形的结合——Ext.ux.tree.ColumnTree 第11章 其他布局类简介 11.1 标准布局类 11.1.1 折叠布局——AccordionLayout 11.1.2 边框布局——BorderLayout...

    精通JS脚本之ExtJS框架.part2.rar

    10.11 树形节点视图——Ext.tree.TreeNodeUI 10.12 表格与树形的结合——Ext.ux.tree.ColumnTree 第11章 其他布局类简介 11.1 标准布局类 11.1.1 折叠布局——AccordionLayout 11.1.2 边框布局——BorderLayout...

    jquery ajax TreeView asp.net改进版

    theme: "bbit-tree-lines", //bbit-tree-lines ,bbit-tree-no-lines,bbit-tree-arrows有线、没线、箭头 三个样式中选择 showcheck: true //是否显示复选框 , checkNodes: checknodes //上面 你事先要传给树控件的...

    Ext Js权威指南(.zip.001

    7.5.11 树节点:ext.data.nodeinterface与ext.data.tree / 364 7.5.12 store的方法 / 366 7.5.13 store的事件 / 368 7.5.14 store管理器:ext.data.storemanager / 369 7.6 综合实例 / 369 7.6.1 远程读取json...

    BioViz-Tree:生物可视化作业 2

    我对树进行了大量修改,以引入我自己的 css 样式、转换和更新,以及下一节中讨论的几种交互。 添加 除了这项作业的基本要求之外,我还做了一些补充。 他们都专注于提高树的交互、分析和聚类质量。 聚类算法允许...

    Ext+JS高级程序设计.rar

    1.1.1 获取HTMLElement节点的Ext.Element实例 2 1.1.2 CSS样式操作 3 1.1.3 DOM查询与遍历 4 1.1.4 DOM操作 6 1.1.5 事件处理 9 1.1.6 尺寸大小 13 1.1.7 定位功能 14 1.1.8 动画功能 16 1.1.9 杂项 19 1.2 Ext Core...

    [原创]基于JQUERY的树形结构插件GooTree

    7、压缩包中有一个Tree文件夹,里面放了背景图片的PNG源文件,可以FIREWORK编辑ico_gootree.png并导出GIF背景图,构造出自己喜欢的一套图标样式。 这东西花了我几个月的时间,期间还有一次标签结构大换血,是由时...

    Ext 开发指南 学习资料

    把表单和输入控件都改成ext的样式。 4.1. 不用ext的form啊,不怕错过有趣的东西吗? 4.2. 慢慢来,先建一个form再说 4.3. 胡乱扫一下输入控件 4.4. 起点高撒,从comboBox往上蹦 4.4.1. 凭空变出个comboBox来。 4.4.2...

    ExtAspNet v2.2.1 (2009-4-1) 值得一看

    -优化Tree节点的NodeId自动生成,减少ViewState占用。 +2009-08-09 v2.0 beta5 +ExtAspNet和Asp.net的提交按钮兼容问题(feedback:千帆)。 -在2009-03-03 v1.3.0曾经提到这个兼容问题,并有这样的规则,如果...

Global site tag (gtag.js) - Google Analytics