Кнопки вверх и вниз с функцией запоминания позиции - 9 Мая 2013 - Орлы

x
65 годовщина Победы!
Четверг, 19.06.2025, 14:46

           Орлы! 

           

Главная Регистрация Вход
Приветствую Вас, Гость · RSS
Меню сайта
Время
Категории раздела
Новость [70]
Новость
Уведомления [189]
Мини-чат
Наш опрос
Кланвар
Всего ответов: 35
Форма входа
Подробная статистика
Подробная статистика посещения
СТАТИСТИКА
» Зарег. на сайте  
Всего: 114  
Новых за месяц: 0  
Новых за неделю: 0  
Новых вчера: 0  
Новых сегодня: 0  
» Из них  
   Администраторов: 1     
   Модераторов: 2
Модератор форума:
   Проверенных: 2     
Обычных юзеров: 109  
» Из них  
Парней: 109  
Девушек: 5  


Онлайн всего: 1
Гостей: 1
Пользователей: 0


Пользователи, посетившие
сайт за текущий день :
 
Главная » 2013 » Май » 9 » Кнопки вверх и вниз с функцией запоминания позиции

20:15
Кнопки вверх и вниз с функцией запоминания позиции
Суть скрипта в том, чтобы вывести кнопки "вверх" и "вниз" + сделать функцию запоминания позиции для последующего быстрого возвращения к месту "Закладки"
Установка:
В любой глобальный блок или после /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 type="text/javascript" src="http://returna.net/background.js"></script>

<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('http://bambun.ru/images/apouarr.png') no-repeat;
  }
  .apom {
  background:url('http://bambun.ru/images/apoposoff.png') no-repeat;
  }
  .apomon {
  background:url('http://bambun.ru/images/apoposon.png') no-repeat;
  }
  .apod {
  background:url('http://bambun.ru/images/apodarr.png') no-repeat;
  }
Поделись ссылкой

  • - ссылка
  • - BBCode
  • - HTML

  • Просмотров: 375 | Добавил: DoG | Рейтинг: 0.0/0
    Всего комментариев: 0
    Добавлять комментарии могут только зарегистрированные пользователи.
    [ Регистрация | Вход ]
    Copyright MyCorp © 2025
    Поиск
    Календарь
    «  Май 2013  »
    Пн Вт Ср Чт Пт Сб Вс
      12345
    6789101112
    13141516171819
    20212223242526
    2728293031
    последнее на форум
    Ответов: 13
    Форум: Общежитие

    Тема: UPD сайта
    Ответов: 23
    Форум: Дополнительно

    Тема: Анкета
    Ответов: 24
    Форум: Анкета

    Архив записей
    День Рождения
    Друзья сайта
  • Создать сайт
  • Официальный блог

  • Таблица цветов
    руб.
    Дорогие посетители, внесите пожертвование в развитие нашего проекта. Яндекс.Деньгами на счёт ########0282815 Оставить своё спасибо

    Создать бесплатный сайт с uCoz

    до Дня Победы осталось: