Скрипт стрелок вверх и вниз

Первое сообщение в теме :

Скрипт который при нажатии на стрелки переносит страницу вверх или вниз, работает на моей html странице которая находится здесь, а на форум этот же скрипт не получается никак прикрутить. Подскажите в чём проблема?

Движок бб3
Вот он форум

Всё работает спасибо Вам, Irbis!!

а делиться не будем?

Скриптом? будем конечно.

Код:

<style type="text/css">
.nav_up{
  padding:7px;
  background-color:white;
  border:1px solid #CCC;
  position:fixed;
  background:transparent url(http://i23.servimg.com/u/f23/12/43/70/13/arrow_10.png) no-repeat top left;
  background-position:50% 50%;
  width:20px;
  height:20px;
  bottom:10px;
  opacity:0.7;
  left:30px;
  white-space:nowrap;
  cursor: pointer;
  -moz-border-radius: 3px 3px 3px 3px;
    -webkit-border-top-left-radius:3px;
  -webkit-border-top-right-radius:3px;
    -khtml-border-top-left-radius:3px;
  -khtml-border-top-right-radius:3px;
  filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70);
}
.nav_down{
  padding:7px;
  background-color:white;
  border:1px solid #CCC;
  position:fixed;
  background:transparent url(http://i23.servimg.com/u/f23/12/43/70/13/arrow_11.png) no-repeat top left;
  background-position:50% 50%;
  width:20px;
  height:20px;
  bottom:10px;
  opacity:0.7;
  left:70px;
  white-space:nowrap;
  cursor: pointer;
  -moz-border-radius: 3px 3px 3px 3px;
    -webkit-border-top-left-radius:3px;
  -webkit-border-top-right-radius:3px;
    -khtml-border-top-left-radius:3px;
  -khtml-border-top-right-radius:3px;
  filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70);
}
</style><div style="display:none;" class="nav_up" id="nav_up"></div><div style="display:none;" class="nav_down" id="nav_down"></div>
<script src="http://www.patmax.eu/J1/110525224642.js" type="text/javascript"></script>
      <script type="text/javascript">
        jQuery(function() {
            var overelem = jQuery('body');
           
            jQuery('#nav_up').fadeIn('slow');
            jQuery('#nav_down').fadeIn('slow'); 
           
            jQuery(window).bind('scrollstart', function(){
              jQuery('#nav_up,#nav_down').stop().animate({'opacity':'0.2'});
            });
            jQuery(window).bind('scrollstop', function(){
              jQuery('#nav_up,#nav_down').stop().animate({'opacity':'1'});
            });
           
            jQuery('#nav_down').click(
              function (e) {
                  jQuery('html, body').animate({scrollTop: overelem.height()}, 800);
              }
            );
            jQuery('#nav_up').click(
              function (e) {
                  jQuery('html, body').animate({scrollTop: '0px'}, 800);
              }
            );
            });
        </script>

Вставляем этот код в виджет и всё.
Кому интересно, пример можно посмотреть у меня на форуме в нижнем левом углу.
Или же кому надо могу скинуть исходники.

Благодарю.
Сама библиотека не нужна

Код:

<script src="http://www.patmax.eu/J1/110525224642.js" type="text/javascript"></script>

Она уже заложена сервисом.))

Спасибо, Домовой Не знал об этом!

Вот немного подкрутил ваше творение на свой вкус.
Может кому такой вариант понравится.
В шаблон или в виджет:

Код:

<div style= "position:fixed; right:0.1%; bottom:45%;" id="nav_up"><img src="http://r28.imgfast.net/users/2814/33/31/58/album/d_ddun10.png" alt="В верх страницы" title="В верх страницы" border="0"/></div>
<div style= "position:fixed; right:0.1%; bottom:41%;" id="nav_down"><img src="http://r28.imgfast.net/users/2814/33/31/58/album/d_ddd10.png" alt="В низ страницы " title="В низ страницы" border="0"/></div>


      <script type="text/javascript">
        jQuery(function() {
            var overelem = jQuery('body');
           
            jQuery('#nav_up').fadeIn('slow');
            jQuery('#nav_down').fadeIn('slow'); 
           
            jQuery('#nav_down').click(
              function (e) {
                  jQuery('html, body').animate({scrollTop: overelem.height()}, 800);
              }
            );
            jQuery('#nav_up').click(
              function (e) {
                  jQuery('html, body').animate({scrollTop: '0px'}, 800);
              }
            );
            });
        </script>

Работает так же, только другое расположение и без CSS
Посмотреть живой пример можно у меня на форуме.

Домовой пишет:
Работает так же, только другое расположение и без CSS

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

Vanilla_83 пишет:подскажите как цвет поменять, приближенный к своему форуму?

Заменить 2 картинки:

Код:

http://r28.imgfast.net/users/2814/33/31/58/album/d_ddun10.png

и

Код:

http://r28.imgfast.net/users/2814/33/31/58/album/d_ddd10.png

На свои перекрашенные.

RockLexa пишет:
Заменить 2 картинки:

Код:

http://r28.imgfast.net/users/2814/33/31/58/album/d_ddun10.png

и

Код:

http://r28.imgfast.net/users/2814/33/31/58/album/d_ddd10.png

На свои перекрашенные.

ясненько, сделала)