Как прокрутить к активному узлу? - PullRequest
11 голосов
/ 20 января 2012

У меня есть dynatree с фиксированной высотой и вертикальной полосой прокрутки.

node.activate ();выбирает узел, который я ищу, но не перемещает вертикальную полосу прокрутки, поэтому мне нужно прокрутить вручную, чтобы увидеть активный узел.

Как мне прокрутить его программно?


Спасибодо 10 марта я решил эту проблему:

var activeLi = node.li;
$('#tree').animate({
    scrollTop: $(activeLi).offset().top - $('#tree').offset().top + $('#tree').scrollTop()
}, 'slow');

Ответы [ 3 ]

8 голосов
/ 23 января 2012

Dynatree не имеет встроенной функции scrollTo. Но вы сможете использовать один из существующих методов и плагинов, как только у вас появится элемент DOM, который вы хотите сделать видимым.

В вашем случае у вас уже есть объект node, поэтому вы можете получить связанный тег <li> и <span>, используя node.li или node.span.

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

.
var node = $("#tree").dynatree("getActiveNode");
// or
var node = $("#tree").dynatree("getTree").getActiveNode();

затем получите связанный элемент DOM:

var activeLI = node && node.li;

или обработать событие активации:

onActivate: function(node) {
    var activeLI = node.li;
    ...
}

Получив элемент, используйте стандартный метод:

Прокрутите до элемента div, используя jquery , jQuery выделите элемент , Как прокрутить до элемента в jQuery? , ...

Редактировать 2014-05 Начиная с Fancytree 2.0 Автопрокрутка была добавлена ​​в качестве стандартной опции.

5 голосов
/ 12 декабря 2012

У меня была похожая проблема, и я не смог заставить работать scrollTop, как указано в примере выше.Я исправил это, изменив селектор с «#tree» на «.dynatree-container»:

$('.dynatree-container').animate({ // animate the scrolling to the node
  scrollTop: $(activeLi).offset().top - $('.dynatree-container').offset().top + $('.dynatree-container').scrollTop()
}, 'slow');

Это должно помочь вам сэкономить несколько часов разочарования (:

ByКстати, я использую dynatree версии 1.22 и jquery 1.8.3 и jquery ui 1.9.2.

0 голосов
/ 28 июля 2013

Существует проблема при использовании $ ('. Dynatree-container'), когда у вас есть более одного дерева на странице, так как при этом будет пытаться выбрать каждое дерево с этим классом. У меня много деревьев, поэтому мне нужно выбрать дерево с определенным идентификатором ... но я нахожу, как и предыдущий человек, что попытка выбрать дерево по его идентификатору (например, "#tree") не работает. Итак, что будет ..? делать что-то вроде = $ ("# prevPageTree"). dynatree ("getTree"). offset также не работает ...

Через несколько минут: ладно, разобрался, как это сделать. Разговор в отладчике Chrome показывает, что класс .dynatree-container фактически присоединен к элементу

...