неділя, 31 січня 2010 р.

Борьба с display:absolute для tablesorterPager

Для Jquery существует огромное множество полезных и не очень плагинов.

Седи этого рзнообразия есть, как на мой взгляд очень полезный плагин Tablessorter.
В свою очередь уже к нему есть плагин для "пагинации" tablesorterPager.

Все прекрасно и замечательно, но в процессе столкнулся с небольшой проблемой: он по умолчанию позиционируется в display: absolute и при изменении размера элементов в сранице выше весьма некрасиво происходит позиционирование с налезанием друг на друга.

Пойти можн одвумя путями:
1. Каждый раз при изменении DOM заново цеплять этот плагин и он бует высчитывать высоту каждый раз заново. Но как по мне не очень красивое решение.
2. Попробовать все-таки позиционировать display: relative;

Документация к сожалению по пагинации очень скудна на сайте. Пришлось лезть в исходник.
Как оказалось решение довольно простое и странно, что разработчики явно не описали документации.
При инициализации этого плагина достаточно передать в качестве параметра:

$('#cards')
.tablesorter({
headers: {1:{sorter:'digit'},
2:{sorter:'digit'},
3:{sorter:'digit'},
5:{sorter:'digit'},
7:{sorter:'digit'}
}
})
.tablesorterPager({container:$('#pager'), pagerPositionSet: true});

параметр pagerPositionSet: true

либо

positionFixed:false

работают оба метода, у себя использовал pagerPositionSet: true.

и єлемент становится с нормальнім относительнім позиционированием.

Немає коментарів:

Дописати коментар