Древовидное представление HTML/JS в стиле метро

Я использую классический вид дерева на своем сайте. Для мобильных устройств я использовал другую специальную версию. На данный момент мой сайт показывал мобильную версию для планшетных устройств, но теперь я буду показывать десктопную версию на планшетных устройствах. Все в порядке, кроме классического древовидного представления - знаки «Развернуть/Свернуть» слишком маленькие и их трудно выбрать.

Может ли кто-нибудь предложить древовидное представление, которое также хорошо разработано для планшетных устройств? Я думаю о чем-то в стиле метро, ​​но не могу найти хороших реализаций или концепций.


javascript html microsoft-metro treeview tablet
person RredCat    schedule 19.02.2013    source источник

Ответы (2)


arrow_upward
0
arrow_downward

Ok. Если никто не знает, как это решить, позвольте мне объяснить, что я сделал для этого.

Похоже, что для этого нет решения. Я сделал внешний вид моего дерева html/js. Вылетает за код js и поет "+"/"-". И добавьте простое поведение.

  • Когда я нажимаю на закрытый элемент древовидного представления - он открывается и детали отфильтровываются соответствующим образом.
  • Когда я нажимаю на элемент открытого дерева - ничего не происходит. Поэтому я не могу закрыть открытый элемент, нажав на него.
  • Когда я нажимаю на шапку (заголовок - место, где я описал, какие у меня есть предметы) - открытый элемент закрывается.

Поэтому я упрощаю текущее древовидное представление (сочетаю действия открытия/закрытия и фильтрации). Это не выглядит глупо на рабочем столе и в то же время полезно на планшетах.

PS: я использовал knockoutjs для фильтрации.

person RredCat    schedule 23.02.2013

arrow_upward
0
arrow_downward

Это поздно, но все же может быть полезно для тех, кто найдет этот вопрос.

Мне нужно было перенести мое приложение VB.net, которое использовало VB.Net Treeview Control, для создания версии HTML/JS с той же функциональностью. Я все еще работаю над этим проектом, но преобразование Treeview было решено год назад с помощью плагина Jquery с именем zTree. Я сделал его совместимым с сенсорными экранами, а также с событиями мыши, и он хорошо работает для меня. Вот ссылки на соответствующие сайты:

VB.Net Treeview Control: http://www.codeguru.com/columns/vb/working-with-the-treeview-control-in-vb.net.htm

zTree: http://www.ztree.me/v3/demo.php#_101

Мое старое приложение VB Treeview: http://www.retirementforecaster.com

Мое новое приложение Treeview HTML/JS (еще ранняя бета): http://www.moneyplan.link

person MartinDuo    schedule 19.05.2015
comment
Я проверил образец ztree, который вы предоставили, я не думаю, что его легко использовать на планшете, особенно потому, что я проверял его на планшете. - person RredCat; 19.05.2015