Блог

Я пытаюсь создать список древовидной структуры для одной из моих задач. Я планирую использовать плагин JS-TREE для этой цели. Тем не менее, плагин поставляется с множеством функций, мне нужно внести несколько изменений в стиль, чтобы соответствовать заданному дизайну.

Это ссылка на code pen, для которой я пытался использовать so,

 1. Change the plus-square with angle-down icon
2. Change the minus-square with angle-up icon
3. change the square-filled-grey icon(will come if any few of child nodes selected) with minus-square icon
4. Hover blue highlighting not needed
  

Есть какой-нибудь способ настроить это? Или какие-нибудь суперхитовые плагины из вашего опыта?

Похоже, что они используют карту спрайтов и меняют положение фона, чтобы выбрать, какой значок отображается

Я смог переместить это

 .jstree-proton .jstree-anchor > .jstree-undetermined {
    background-position: -38px -5px;
}
  

Это удовлетворило # 3. Если вы проверите любой из значков (jstree-icon class), вы увидите фон, присвоенный 32.png. Вам придется изменить расположение существующих там значков. Для наклона вверх и вниз вам придется скрыть фоновое изображение, которое они предоставили, и вставить свои собственные значки

Почему бы вам не попробовать создать файл css и не перезаписать параметр класса jstree «!важно» в конце правил, которые вы хотите изменить? Для меня это сработало, потому что мне нужно было изменить класс jstree-rename-input следующим образом.

 .jstree-rename-input {
    border: none !important;
    width: 250px !important;
  }  

Насколько я исследовал, это также официальный ответ, предоставленный jsTree creator.