Новый вид переключателя страниц "Подгрузка контента" для Ucoz
Скриншот материала «Новый вид переключателя страниц "Подгрузка контента" для Ucoz»
Описание: Задача данного скрипта подгружать контент, который находится на следующей странице, нажатием одной кнопки "Подгрузить материалы". Достойная замена стандартным переключателям uCoz. Он не только с экономит трафик Ваших дорогих пользователей, но и сведет к минимуму ожидание между стандартным переключением между страницами.
Установка: Управление дизайном » Главная страница каталога файлов, находим там $BODY$ и заменяем его на это:
Код
<div id="contik">$BODY$</div>
Вставляем этот скрипт чуть ниже:
Код
<div style="display:none;" id="selector">$PAGE_SELECTOR$</div>
<script type="text/javascript">
if ($("#selector").find(".swchItem:contains('»')").text() == '»') {
$("#selector").after('<br><div id="nextCont" class="input_submit alt" style="display:block; text-align:center;"><div onclick="Conti.to();" style="padding:3px;"><b>Подгрузить материалы</b></div></div>');
};
Conti = {
to:function(){
$("#nextCont").html('<div style="padding:4px"><img src="http://ВАШ САЙТ/2.gif" border="0" /></div>');
nextik = $("#selector").find(".swchItem:contains('»')").attr('onclick').toString();
num = nextik.match(/\d/);
$.get('/load/0-'+num, function(next){
$("#contik").append( $("#contik", next).html() );
$("#selector").html( $("#selector", next).html() );
$("#nextCont").html('<div onclick="Conti.to();" style="padding:3px;"><b>Подгрузить материалы</b></div>');
if ($("#selector", next).find(".swchItem:contains('»')").html() == null) { $("#nextCont").fadeOut(); };
});
}
}
</script>
Заходим в CSS и ставим:
Код
/* Подгрузка контента */
div.input_submit {background:#2a3946 url("http://ВАШ САЙТ/1.png") repeat-x 0 0px; border:1px solid #202c36; color:#fff;
display:inline-block; padding:5px 10px; text-align:center; text-shadow:rgba(0,0,0,0.7) 0px 1px 0px; -moz-border-radius:1px;-webkit-border-radius:1px;border-radius:1px;}
div.input_submit:hover {background-color:#364959; color:#fff; cursor:pointer;}
div.input_submit.alt {background:#758a9d url("http://ВАШ САЙТ/1.png") repeat-x 0 0px; border:1px solid #61768a;
color:#e6edf4; text-shadow:rgba(0,0,0,0.3) 0px 1px 0px}
div.input_submit.alt:hover {background-color:#8197aa; color:#fff; cursor:pointer;}
div.input_submit.some {background:#e9e9e9 url("http://ВАШ САЙТ/1.png") repeat-x 0 0; border:1px solid #ccc;
text-shadow:#fff 0px 1px 0px; color:#666;}
div.input_submit.some:hover {cursor:default; background-color:#f9f9f9; color:#666}
/* Подгрузка контента */
на ваши ссылки.
