Как изменить значок dgrid-expando в дереве dgrid

Не могли бы вы помочь, как изменить развернуть / свернуть значок треугольника на мой пользовательский значок (+,-) в сетке дерева. Кроме того, как удалить все границы таблицы в сетке. Надеюсь, что это можно сделать через css.

@Himanshu - это не dojoxGrid, а скорее dgrid. Я посмотрел в dgrid.css, чтобы увидеть, могу ли я найти что-то похожее, и нашел их. Как мне представить четыре состояния: расширение (нормальное, зависание) и коллапс (нормальное, зависание).

 .dgrid-expando-icon {
 width: 16px;
 height: 16px;
}    
ui-icon {
 width: 16px;
  height: 16px;
  background-image: url("images/ui-icons_222222_256x240.png");
}

Значок Expandor

2 ответа

Решение

Используйте следующий CSS, чтобы изменить значок по умолчанию для dojox.grid.TreeGrid,

!important позволяет переопределить значение свойства CSS по умолчанию.

.dojoxGridExpandoNode {
    background-image: url('http://findicons.com/files/icons/2625/google_plus_interface_icons/18/star.png') !important;
}

Живой пример, значок изменения в начале:

http://jsfiddle.net/zx4g3z02/2/

Значок развернуть / свернуть происходит из background-image собственность div соответствующий классу dojoxGridExpandoNode, Таким образом, вы можете переопределить его CSS и применить свой собственный background-image имущество.

По умолчанию изображение представляет собой комбинацию из четырех изображений, которые имеют два изображения для увеличения (нормальное и наведение) и два изображения для свертывания (нормальное и наведение) и только background-position свойство меняется во время onmouseover и onlcick на значке узла. Таким образом, вам придется сделать свое собственное изображение соответственно. Или переопределить onmouseover а также onclick функциональность узла развернуть / свернуть, чтобы соответствующим образом манипулировать изображением.

Другие вопросы по тегам