2016-06-27 2 views
1

Я работаю над таблицей, которая, в зависимости от пользовательских данных, может быть слишком широкой, чтобы соответствовать на дисплее, поэтому мы сделали ее «overflow: auto;».Autoscrolling table

Я хочу, чтобы иметь возможность автоматически прокручивать таблицу так, чтобы отображалась определенная ячейка с именем - say: ('cell_' + row + '_' + col).

Как это получить? Я видел пару предложений здесь, в которых участвовал jQuery, но не мог заставить их ничего делать.

Мне не нужна плавная анимация, на самом деле я бы предпочёл, чтобы ее не было, поскольку я нахожу, что это развлечение для пользователей.

ответ

0

Заканчивать this скрипку:

JavaScript

var container = $(".narrow"); 
container.scrollTop(0); 
container.scrollLeft(0); 
container.scrollTop($("#cell_3_3").offset().top - container.offset().top); 
container.scrollLeft($("#cell_3_3").offset().left - container.offset().left); 

HTML

<div class="narrow"> 
    <table> 
    <tr> 
     <td id="cell_1_1">1. Content ...</td> 
     ..... 
    </tr> 
    ..... 
    </table> 
</div> 

CSS

.narrow { 
    max-width: 100px; 
    max-height: 200px; 
    overflow: auto; 
} 

UPDATE 1

Новый fiddle, чтобы продемонстрировать лучше. Цикл через все ячейки.

+0

Спасибо, это как раз то, что я был после. –

+0

@NickLevine Пожалуйста, поддержите и отметьте как ответ, если это вам помогло. – Arg0n

Смежные вопросы