【问题标题】:How to change the icon of a JStree node using only css?如何仅使用 css 更改 JStree 节点的图标?
【发布时间】:2012-06-19 14:41:16
【问题描述】:

我正在尝试找出如何仅使用 css 更改 JStree 节点的图标? 有很多帖子解释如何使用 javascript 进行操作,但我更喜欢仅使用 css。

到目前为止,这是我的代码:

$("#treeview").jstree().on('loaded.jstree', function()
{
    $("#treeview").jstree('open_all');
});

还有HTML:

<div id="treeview">
  <ul>
    <li>
      <a href="#">abcdefghijkl</a>
      <ul>
        <li>
          <a href="#" onclick="goTo('index.php?module=klimaat&amp;pagina=dashboard&amp;id=6',false);">
          Beneden</a>
        </li>
        <li>
          <a href="#" onclick="goTo('index.php?module=klimaat&amp;pagina=dashboard&amp;id=7',false);">
          Boven</a>
        </li>
      </ul>
    </li>
  </ul>
</div>

对于 CSS,我使用 jstree 提供的默认样式表。 jstree提供的文档真的很烂。所以stackoverflow是一个很大的帮助,但是我在网站上找不到这个。

如果您需要更多代码或信息,请询问。谢谢

【问题讨论】:

    标签: css icons jstree


    【解决方案1】:

    您只需将其包含在 CSS 中:

    a .jstree-icon
    {
        background-image: url("yourimage.png")!important;
        background-position: 0!important;
    }
    

    This is a fiddle 工作正常(2016 年更新):

    【讨论】:

    • 谢谢,我会在今天晚些时候尝试这个。希望它有效,然后我会除了你的回答;)
    • 你的回答对我来说并不完全有效,所以我改成了这个 .jstree-default li a ins { background:url("../images/icoons/search.png") 0px 0px no -重复!重要; }
    • 答案很旧,jsfiddle 不起作用,但它仍然可以。我也可以建议使用响应 json 的 icon 属性并在那里传递 css 类名。
    猜你喜欢
    • 1970-01-01
    • 2011-10-12
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2023-04-11
    • 1970-01-01
    • 1970-01-01
    • 2015-08-05
    相关资源
    最近更新 更多