RTB RTB -4 years ago 262
CSS Question

How to change the icon of a JStree node using only css?

I'm trying to find out how to change the icon of a JStree node using only css?
There are a lot of posts explaining on doing it with javascript but i prefer to use css only.

Here's my code so far:

$("#treeview").jstree().on('loaded.jstree', function()

And the Html:

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

For CSS i'm using the default style sheet delivered by jstree. The documentation provided by jstree is really crappy. So stackoverflow is a big help, but i couldn't find this one on the website.

If you need more code or information, please ask. Thanks

Answer Source


You just have to include this on the css:

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


Here is a fiddle which works correctly (updated in 2016):


Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download