Форум поддержки IPB.SU [Powered by Invision Power Board]

Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате

Форум поддержки IPB.SU > Поддержка модификаций > Пагинатор

Автор: Romych Фев 11 2012, 01:49

в общем-то переход по страницам из конца в середину, можно осуществлять традиционным путём, введя в диалоговое окно нужный номер страницы темы, но можно чуточку побыстрее, и чуточку по красивее,
в общем сделал вот такой пагинатор, срабатывающий при наведении курсора на ссылки страниц темы

user posted image

Пагинатор

устанавливаем в
Главная страница AЦ -> Скины и Шаблоны -> Настройка скинов -> HTML -> Просмотр темы (Topic View Section) -> Footer (Редактировать)
в самый верх

Код

<script type="text/javascript">
$('div#ipbwrapper1 table tbody tr td a:first').map(function () {
text = $(this).html();
text2 = $(this).attr('href');
topic=text2.slice(text2.indexOf("showtopic=")+10,-2);
ss=/(\\d+)\\'\\,(\\d+)\\,(\\d+)/g;
pd=(topic.replace(ss, '$1')); // номер темы
pd2=parseInt(topic.replace(ss, '$2')); // максимум сообщений в теме
pd3=parseInt(topic.replace(ss, '$3')); // максимум сообщений на странице (шаг)
var paginator='<div id="pagenav" style="display:none"><table id="paginator"><tr>';
if ( pd2 > 0 && pd3 > 0 )
for (p=0; p<=pd2; p+=pd3) {
m = p/pd3+1;
paginator += '<td><a id="pnav" style="text-decoration:none;padding:5px;" href="/index.php?showtopic='+pd+'&st='+p+'"> '+m+' </a></td>';
if (m%5 == 0) paginator += '</tr><tr>';
}
paginator += '</tr></table></div>';
$('div#ipbwrapper1 table tbody tr td:first').append(paginator); });
$('div#ipbwrapper1 table tbody tr td').hover(function(){
$(this).find('#pagenav').toggle(); });
</script>

стиль оформления
в Главная страница AЦ -> Скины и Шаблоны -> Настройка скинов -> CSS
самый низ

Код

#paginator {
opacity: 0.9;
position: absolute;
left: 95px;
z-index: 1000;
filter: alpha(opacity=90);
background-color: #61bde7; /* фон блока пагинатора */
border: 2px solid #59add4; /* цвет границы блока */
table-layout: auto !important;
width: auto !important;
background-image: -webkit-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
background-image: -moz-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
background-image: -ms-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
background-image: -o-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
background-image: linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
-moz-border-radius: 4px;
border-radius: 4px;
khtml-border-radius:4px;
-webkit-border-radius:4px;
-moz-box-shadow: 0 1px 2px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,.5) inset;
-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,.5) inset;
box-shadow: 0 1px 2px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,.5) inset;
text-shadow: 0 1px 0 rgba(255,255,255,.4);
}

#paginator td {
padding: 0.1em;
border-style: none;
}

#pnav:hover {
background: black; /* фон цифры при наведении курсора */
color: lime; /* цвет цифры при наведении курсора */
-moz-border-radius: 9000em;
border-radius: 9000em;
khtml-border-radius:9000em;
-webkit-border-radius:9000em;
font-weight: bold;
}

http://examp.ipb.su/index.php?showtopic=1&st=60 работы

Автор: WARLORD Фев 11 2012, 11:00

Спасибо! Поставлю к себе на форум. Кстати очень полезная модификация.

А если страниц более 100 (К примеру) то он будет все их отображать?

Автор: WARLORD Фев 11 2012, 11:16

Странно, но у меня почему то не работает, все сделал как написано. Но без изменений.

Автор: Romych Фев 11 2012, 11:28

Цитата (WARLORD @ Фев 11 2012, 11:00)

да, будет отображать все 100 страниц,
если по каким-то причинам не работает попробуйте ещё раз поставить ту часть, которая ставится в Главная страница AЦ -> Скины и Шаблоны -> Настройка скинов -> HTML -> Просмотр темы (Topic View Section) -> Footer (Редактировать)
предыдущую попытку при этом удалив, скрипт потому что содержит регулярное выражение с обратными слэшами, а они при сохранении вырезаются

Автор: WARLORD Фев 11 2012, 11:56

Опять тоже самое, не работает.

Может какой то скрипт забыли упомянуть? Ну или другое что то...

Автор: Romych Фев 11 2012, 12:28

а попробуйте уменьшить количество отображаемых сообщений на одной странице темы, сейчас у вас вроде бы 25, сделайте например 15, чтоб поглядеть, будут ли изменения,

я проверяю, вроде бы ничего не упустил, в инструкции

Автор: asm-a Фев 11 2012, 12:30

Установил у себя и тоже не работает.
Хотя на вашем форуме работает.

Цитата

будут ли изменения,

у меня 15 и не работают.

Автор: Romych Фев 11 2012, 12:37

Цитата (аsm-а @ Фев 11 2012, 12:30)

Установил у себя и тоже не работает.
Хотя на вашем форуме работает.

Цитата

будут ли изменения,

у меня 15 и не работают.

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

Автор: asm-a Фев 11 2012, 12:40

http:///index.php?showuser=2237, может, этот скрипт засунуть в Header? Сейчас попробую немного по шаманить.

Автор: Romych Фев 11 2012, 12:41

http:///index.php?showuser=2333,

у вас единственная тема, в которой можно было бы нормально проверить - http://exf.ipb.su/index.php?showtopic=24&st=75
но не наблюдаю у вис ни скрипта, ни стиля к нему

Автор: asm-a Фев 11 2012, 12:43

http:///index.php?showuser=2237, пагинатор стоит и в стиле, и в футере. Все вроде по инструкции сделано.

Автор: Romych Фев 11 2012, 12:57

http:///index.php?showuser=2333,

а у вас гости видят один стиль, а пользователи другой?
я вот захожу как гость, просматриваю исходный код, не вижу ни стиля пагинатора в CSS блоке, ни скрипта его в футере

такое ощущение, что вы всё закинули в шаблон другого стиля

Автор: asm-a Фев 11 2012, 13:20

http:///index.php?showuser=2237, гости и пользователи видят один стиль (черный), другой стоит при выборе, но им никто не пользуется.

Автор: Romych Фев 11 2012, 13:44

http:///index.php?showuser=2333, может быть я не туда захожу? http://exf.ipb.su/

Автор: asm-a Фев 11 2012, 15:55

http:///index.php?showuser=2237, этот форум. Других у меня нету.

Автор: Romych Фев 12 2012, 22:59

в общем пошёл немного другим путём
устанавливаем скрипт пагинатора в
Альтернативный вариант установки пагинатора

Главная страница AЦ -> Скины и Шаблоны -> Настройка скинов -> HTML -> Глобальные шаблоны (Global HTML elements) -> make_page_jump (Редактировать)
в
самый низ:

Код

<script type="text/javascript">
var paginator='<div id="pagenav" style="display:none;position:absolute;"><table id="paginator"><tr>';
for (var p=0; p<=$tp; p+=$pp) {
var m = p/$pp+1;
paginator += '<td><a id="pnav" style="text-decoration:none;padding:5px;" href="/index.php?showtopic=$ub&st='+p+'"> '+m+' </a></td>';
if (m%5 == 0) paginator += '</tr><tr>';
}
paginator += '</tr></table></div>';
$('div#ipbwrapper1 table tbody tr td:first').hover(
function(){
$(this).append(paginator);
$(this).find('#pagenav').toggle();
},
function(){
$(this).find('div:last').remove();
} );
</script>

стиль оформления остаётся прежним, но на всякий случай продублирую
в Главная страница AЦ -> Скины и Шаблоны -> Настройка скинов -> CSS
самый низ

Код

http://examp.ipb.su/index.php?showtopic=1&st=60 тот же,
тестируем

Автор: asm-a Фев 13 2012, 13:34

Все равно не работает

http://exf.ipb.su/index.php?showtopic=24

Автор: Romych Фев 13 2012, 15:06

заходя на ваш форум я вижу вот такой шаблон
http://uploads.ru/i/f/T/G/fTGmj.png

при просмотре исходного кода которого, я не вижу ни стиля пагинатора, ни самого скрипта в положенном месте, так что не знаю какой именно вы шаблон редактируете, но в том, что видят гости, пагинатором и не пахнет

Автор: WARLORD Фев 13 2012, 16:05

http:///index.php?showuser=2237, а какой у Вас стиль? Может это из-за него не работает?

Автор: asm-a Фев 13 2012, 16:26

http:///index.php?showuser=2237, изменил

Автор: Romych Фев 13 2012, 18:57

Цитата (WARLORD @ Фев 13 2012, 17:05)

http:///index.php?showuser=2237, а какой у Вас стиль? Может это из-за него не работает?

у меня стиль называется - examp

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

Цитата

div#ipbwrapper1 table tbody tr td

а у вас:

Цитата

div#ipbwrapper table tbody tr td

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

Цитата

$('div#ipbwrapper1 table tbody tr td:first').hover(

надо заменить на эту:

Цитата

$('div#ipbwrapper table tbody tr td:first').hover(

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

Автор: asm-a Фев 13 2012, 19:07

Цитата

у меня стиль называется - examp

Поправлю. Ваш стиль называется IP.Board. CSS у IPB, а картинки у examp.

user posted image

Автор: Romych Фев 13 2012, 19:40

Цитата (аsm-а @ Фев 13 2012, 20:07)

Поправлю. Ваш стиль называется IP.Board. CSS у IPB, а картинки у examp.

user posted image

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

Автор: WARLORD Фев 13 2012, 20:22

У меня этот код работает только при наведении на графу портал.

В итоге я удалил код, а когда автор его усовершенствует я поставлю.

Автор: asm-a Фев 13 2012, 21:03

Цитата

какой браузер?

FireFox 11

Автор: Romych Фев 13 2012, 22:36

Цитата (WARLORD @ Фев 13 2012, 21:22)

угу, вижу, блин какая же однако разница в селекторах разных стилей, ок, будем работать

Автор: Romych Фев 14 2012, 09:33

раз такая пляска с селекторами в разных стилях, мы не будем идти у них на поводу и создадим свой, а для этого мы присвоим нужной нам ячейке определённый класс,
с этого и начнём
1
в
Главная страница AЦ -> Скины и Шаблоны -> Настройка скинов -> HTML -> Просмотр темы (Topic View Section) -> Header (Редактировать)
ищем вот такую строку

Цитата

<td align='left' width="20%" nowrap="nowrap">{$data['TOPIC']['SHOW_PAGES']} {$data['TOPIC']['go_new']}</td>

и добавляем к ней класс class="paginat"

Цитата

<td align='left' width="20%" nowrap="nowrap" class="paginat">{$data['TOPIC']['SHOW_PAGES']} {$data['TOPIC']['go_new']}</td>

сохраняем,
а дальше уже дело техники
2
Главная страница AЦ -> Скины и Шаблоны -> Настройка скинов -> HTML -> Глобальные шаблоны (Global HTML elements) -> make_page_jump (Редактировать)
в
самый низ добавляем скрипт:

Код

<script type="text/javascript">
var paginator='<div id="pagenav" style="display:none;position:absolute;"><table id="paginator"><tr>';
if ( $tp > 0 && $pp > 0 )
for (var p=0; p<=$tp; p+=$pp) {
var m = p/$pp+1;
paginator += '<td><a id="pnav" style="text-decoration:none;padding:5px;" href="/index.php?showtopic=$ub&st='+p+'"> '+m+' </a></td>';
if (m%5 == 0) paginator += '</tr><tr>';
}
paginator += '</tr></table></div>';
$('td.paginat').hover(
function(){
$(this).append(paginator);
$(this).find('#pagenav').toggle();
},
function(){
$(this).find('div:last').remove();
});
</script>

стиль оформления у нас не меняется, но опять дублирую
3

в Главная страница AЦ -> Скины и Шаблоны -> Настройка скинов -> CSS
самый низ

Код

_______________________________________
должно работать независимо теперь от стиля

Автор: WARLORD Фев 14 2012, 10:41

Теперь да, все работает! Спасибо!!!

PS только как добавить на нижнее веню выбора страницы? Которое в самом низу темы.

Автор: asm-a Фев 14 2012, 12:51

http:///index.php?showuser=3443, вместо Header открывайте Footer

Автор: Romych Фев 14 2012, 14:22

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

Главная страница AЦ -> Скины и Шаблоны -> Настройка скинов -> HTML -> Просмотр темы (Topic View Section) -> Footer (Редактировать)

ищем строку

Цитата

добавляем

Цитата

и всё

Автор: Snow Мар 8 2013, 09:16

Смотрится симпатично, но при попытке перейти к нужной странице выдает ошибку.

Автор: AweDer Мар 8 2013, 13:49

http://ipboard.net/index.php?showuser=3794,Да я месяцев 5 назад тоже ставил красивая модификация, но ошибку выдает поэтому убрал.