Мы в твиттере Мы в телеграме!

Провеббер » DataLife Engine » DLE хаки » Кнопка наверх с использованием jQuery

Набор в команду! Ведется набор в команду, для наполнения сайта новым, интересным контентом. Если у тебя есть предложения, свободное время, ты обладаешь интересным контентом, и хочешь поделиться с другими?
Обращайся к нам в ЛС группы Вконтакте.

Кнопка наверх с использованием jQuery

Данный материал предоставлен сайтом ProWebber.cc исключительно в ознакомительных целях. Администрация не несет ответственности за его содержимое.
Скачать бесплатно Кнопка наверх с использованием jQuery.

Кнопка наверх с использованием jQuery


Установка:
1. В файле main.tpl, перед тегом
</head>
вставляем следующий код:
<script type="text/javascript">

  

      (function(jq) {

         jq.autoScroll = function(ops) {

         ops = ops || {};

         ops.styleClass = ops.styleClass || 'scroll-to-top-button';

         var t = jq('<div class="'+ops.styleClass+'"></div>'),

            d = jq(ops.target || document);

         jq(ops.container || 'body').append(t);



         t.css({

            opacity: 0,

            position: 'absolute',

            top: 0,

            right: 0

         }).click(function() {

            jq('html,body').animate({

               scrollTop: 0

            }, ops.scrollDuration || 1000);

         });



         $(window).scroll(function(){

            var sv = d.scrollTop();

            if (sv < 10) {

               t.clearQueue().fadeOut(ops.hideDuration || 200);

               return;

            }



            t.css('display', '').clearQueue().animate({

               top: sv,

               opacity: 0.8

            }, ops.showDuration || 500);

         });

      };

   })(jQuery);



   $(document).ready(function(){

      $.autoScroll({

         scrollDuration: 2000,

         showDuration: 600,

         hideDuration: 300

      });

   });

  

</script>


2. В файле стилей дописываем следующий css код:
/*Кнопка наверх*/
.scroll-to-top-button{ background: #666 url("../images/ups.png") center center no-repeat;
    width: 32px;
    height: 32px;
    color: #fff; font-family: verdana;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -o-border-radius: 5px;
    cursor: pointer;
    padding: 15px;
    margin: 20px;
}


3. Скачиваем картинку и заливаем на сервер в templates/имя шаблона/images

P.S. Данный плагин работает не только на DLE, а и на других движках.

Внимание! У Вас нет прав для просмотра скрытого текста.


Дополнительные ссылки на скачивание ТОЛЬКО для зарегистрированных


+2
Просмотры: 8 434 :: Комментарии (30) :: :: Нужна помощь? Задайте вопрос на форуме ::
Уважаемый посетитель, Вы зашли на сайт как незарегистрированный пользователь.
Мы рекомендуем Вам зарегистрироваться либо войти на сайт под своим именем.

#21Fox

  • 13 июля 2011 16:58
  • Регистрация: 4.03.2011
  • Был(а) онлайн: 7.02.2021
  • Комментариев: 166
  • 0
клаас спасибо dance

#22Denisios

  • 13 июля 2011 21:39
  • Регистрация: 2.07.2011
  • Был(а) онлайн: 17.02.2013
  • Комментариев: 68
  • 0
Если вам понравилось улучшение, то спасибо можно выражать в виде плюсика в репу.

#23SanekAS

  • 19 августа 2011 19:14
  • Регистрация: 26.04.2010
  • Был(а) онлайн: 4.05.2020
  • Комментариев: 10
  • 0
оч помог спс

#24danya_sabo

  • 19 сентября 2011 11:32
  • Регистрация: 28.08.2011
  • Был(а) онлайн: 7.10.2015
  • Комментариев: 18
  • 0
Я все поставил и прописал но эффектов 00000 dash

#25Kittis

  • 9 октября 2011 04:23
  • Регистрация: 1.02.2011
  • Был(а) онлайн: 6.04.2014
  • Комментариев: 15
  • 0
Спасибо дружище, так намного лучше.

#26lowara

  • 21 декабря 2011 14:48
  • Регистрация: 11.02.2011
  • Был(а) онлайн: 9.09.2021
  • Комментариев: 41
  • 0
спасибо беру smile

#27podrapom

  • 25 декабря 2011 22:25
  • Регистрация: 22.12.2011
  • Был(а) онлайн: 15.05.2012
  • Комментариев: 49
  • 0
а аякс уже подгруженый отхавать не вариант? в обяз подгружать?
плохо.

#28lynch

  • 8 января 2012 00:16
  • Регистрация: 24.02.2011
  • Был(а) онлайн: 8.01.2012
  • Комментариев: 2
  • 0
хз но стрелки так и не увидел(((((((((((((

#29djgelius

  • 5 марта 2012 17:15
  • Регистрация: 16.08.2011
  • Был(а) онлайн: 13.08.2024
  • Комментариев: 10
  • 0
все прекрастно работает просто надо очистить кешь или нажать кнопку перезагрузить страницу

правда у меня с первого раза не заработало я взял здесь код и в коде переименовал файл на свой и все пошло
http://www.dle9.com/haki/863-hak-dle-ustanovka-knopka-vverh-perehoda.html
взято осюда

#30milkiway

  • 12 июня 2012 13:24
  • Регистрация: 30.03.2012
  • Был(а) онлайн: 21.11.2013
  • Комментариев: 42
  • 0
отлично! magnify

1 2
Предыдущая    Следующая
Информация
Посетители, находящиеся в группе Гости, не могут оставлять комментарии к данной публикации.

Архив новостей
Ноябрь 2024 (9)
Октябрь 2024 (169)
Сентябрь 2024 (13)
Август 2024 (60)
Июль 2024 (12)
Июнь 2024 (30)

Последние комментарии: