На портале уже 561 , зарегистрировано 9843 и написано 803 .
Иконки для тёмного д...
Светлый шаблон для с...
Превью изображений
Гостевая книга
Требуется персонал!
Главная страница Архив всех материалов Скрипты для uCoz - Scripts for uCoz Кнопка вверх и вниз + запоминание позиции для uCoz

Кнопка вверх и вниз + запоминание позиции для uCoz

  • Добавил: CobRa
  • Дата: 2017-07-25, 9:51 AM
  • Комментариев: 16
  • Просмотров: 2929
Скриншот материала «Кнопка вверх и вниз + запоминание позиции для uCoz»

Недавно наткнулись на простенький скрипт, но вот именно своей невинной простотой он меня и порадовал. Самые обыкновенные кнопки Вверх и Вниз, а к ним очень удобная функция дописана - возможность запоминать позицию. Сделано все чистенько и дизайн стильный, так что, думаю, на любом достойном сайте найдется достойно же место для кнопочек-запоминалочек. Более подробно читайте на аргументах.

Как вы поняли, посмотрев демо - этот скрипт отлично подходит для сайтов, богатых на видео-файлы, например. Вы спокойно листаете бесконечно-длинную страницу, находите что интересное, но, как всем известно - лучшее вграг хорошего. Чтобы не потерять найденные видеофайлы - просто делаете клик по кнопочке для запоминания, она запоминает позицию, а вы можете искать дальше. Когда надоест и захочется вернуться - один легкий клик по той же круглой кнопке запоминания и все - вы вернулись. Это удобно, потому что иногда нужный файл где-то не то что по середине или в конце, а вообще неизвестно где затерялся и вы начинаете искать его, теряете вообще все, попутно закрывая вкладку с музыкой. А тут все просто - нашли, зафиксировали позицию, пошли дальше, не понравилось - вернулись. Скрипт простой и легки, но практичный.

Важно: Картинки из прикреплённого архива залейте в папку images

Установка:

В любой глобальный блок или после /head на нужных страницах вставляйте:

<div class="apoud">
<div onclick="$('body').scrollTo(0, 300);" class="apou"></div>
<div class="apom" title="Запоминалка позиции"></div>
<div onclick="$('body').scrollTo($('body').height()+500, 300);" class="apod"></div>
</div>

<script>
var apotop;
$('.apom').toggle(function() {
$(this).addClass('apomon');
apotop = $('body').scrollTop();
}, function() {
$('body').scrollTo(apotop, 300);
$(this).removeClass('apomon');
});
// ApoTeam (c) 2013
</script>

 


В самый низ вашего css:

 

.apoud {
position:fixed;
z-index:100;
bottom:15px;
right:15px;
}

.apou, .apom, .apod {
cursor:pointer;
width:32px;
height:32px;
}

.apou {
background:url('/images/apouarr.png') no-repeat;
}
.apom {
background:url('/images/apoposoff.png') no-repeat;
}
.apomon {
background:url('/images/apoposon.png') no-repeat;
}
.apod {
background:url('/images/apodarr.png') no-repeat;
}

 

 

 

 

 



Будьте внимательны! Этот материал «Кнопка вверх и вниз + запоминание позиции для uCoz» из раздела «Скрипты для uCoz - Scripts for uCoz» является уникальной собственностью проекта www.ucozzz.ru, поэтому, при частичном или полном копировании, Вы обязаны установить ссылку на наш портал, как источник материала.
№16 ludmila1811 написал: 2014-11-16 в 8:07 PM Спам
ludmila1811
Огромное спасибо! Всё получилось и всё отлично работает!
№15 protokol написал: 2013-12-11 в 1:05 PM Спам
protokol
спасибо, думаю пригодится
№14 kaban написал: 2013-12-05 в 5:46 PM Спам
kaban
удобная штука есть такая в контакте
№13 milena написал: 2013-12-04 в 10:31 PM Спам
milena
Вот это именно то, что я искала)
№12 twister1 написал: 2013-12-04 в 3:03 PM Спам
twister1
удобная функция
№11 AAskorohod написал: 2013-12-02 в 4:52 AM Спам
AAskorohod
Отлично...
№10 larenwillow написал: 2013-12-02 в 2:30 AM Спам
larenwillow
Спасибо, интересная прога
№9 leg0zor написал: 2013-12-02 в 2:19 AM Спам
leg0zor
Очень классный скрипт. Кажется так сложно, но после того, как опробовал - все стало ясно как солнце!
№8 medion123 написал: 2013-12-02 в 0:16 AM Спам
где то я такое уже читал
№7 Jake написал: 2013-12-01 в 11:09 PM Спам
Прикольная кнопка)
1-10 11-16
Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]