скроллер!

Всем привет...
интересует вот такой вопрос.. возможно ли реализовать на форуме (phpBB3)
вот этот скроллер КЛАЦ!

Если да, помогите разобраться - КАК?!

Данный скрипт можно установить.

Общий алгоритм действий:
1) Скачать и распаковать архив.
2) Поставить в нужное место форума html-код с картинками для скроллера
3) Залить скрипты на http://yourjavascript.com/ или https://patmax.error/ получить прямые ссылки и вставить их в форум
4) Установить скрипт настройки.

Если Вы не уверены, что сможете сделать это сами, то подождите, пожалуйста, пока я не проделаю все это на тестовике и выложу готовый рабочий результат.

ой, было б замечательно.. а то я уже и так и эдак... ничего не выходит ....

Вот так будет выглядеть результат:



1. Устанавливаете в требуемое место форума (я для примера ставила в приветствие на главной странице) скрипты + сам код скроллера:

Код:

<script type="text/javascript" src="http://www.patmax.eu/J1/130114175542.js"></script>
<script type="text/javascript" src="http://www.patmax.eu/J1/130114175800.js"></script>
<script type="text/javascript" src="http://www.patmax.eu/J1/130114180310.js"></script><div class="scroller demo1">
   <div class="inside">
      <a href="#"><img src="http://i13.servimg.com/u/f13/16/54/26/99/img210.jpg" alt="" /></a>
      <a href="#"><img src="http://i13.servimg.com/u/f13/16/54/26/99/img310.jpg" alt="" /></a>
      <a href="#"><img src="http://i13.servimg.com/u/f13/16/54/26/99/img410.jpg" alt="" /></a>
      <a href="#"><img src="http://i13.servimg.com/u/f13/16/54/26/99/img510.jpg" alt="" /></a>
      <a href="#"><img src="http://i13.servimg.com/u/f13/16/54/26/99/img610.jpg" alt="" /></a>
      <a href="#"><img src="http://i13.servimg.com/u/f13/16/54/26/99/img710.jpg" alt="" /></a>
      <a href="#"><img src="http://i13.servimg.com/u/f13/16/54/26/99/img810.jpg" alt="" /></a>
      <a href="#"><img src="http://i13.servimg.com/u/f13/16/54/26/99/img910.jpg" alt="" /></a>
      <a href="#"><img src="http://i13.servimg.com/u/f13/16/54/26/99/img1210.jpg" alt="" /></a>
      <a href="#"><img src="http://i13.servimg.com/u/f13/16/54/26/99/img1410.jpg" alt="" /></a>
      <a href="#"><img src="http://i13.servimg.com/u/f13/16/54/26/99/img1510.jpg" alt="" /></a>
      <a href="#"><img src="http://i13.servimg.com/u/f13/16/54/26/99/img1110.jpg" alt="" /></a>
      <a href="#"><img src="http://i13.servimg.com/u/f13/16/54/26/99/img1010.jpg" alt="" /></a>
      <a href="#"><img src="http://i13.servimg.com/u/f13/16/54/26/99/img110.jpg" alt="" /></a>
   </div>
</div>


Ссылки на изображения https://i.servimg.com/u/f13/16/54/26/99/img210.jpg и пр. заменяете на свои картинки. В кодах ссылок <a href="#"> меняете # на нужные Вам ссылки. Сохраняете готовый результат.

2. В СSS добавляете настройки:

Код:

.demo1 {
float:left;
clear:both;
width:900px; /* ширина всего блока */
height:200px; /* высота всего блока */
overflow:hidden;
position:relative;
background-color: #ddd /* фон всего блока */
}

.demo1 .inside {
position:absolute;
top:50%;
left: 0;
height:200px; /* высота строки с иконками */
margin-top:-55px;
}

.demo1 a {
display:block;
position:absolute;
width:100px; /* ширина круглой иконки */
height:100px; /* высота круглой иконки */
overflow:hidden;
-moz-border-radius:100px;
-webkit-border-radius:100px;
border-radius:100px; /* радиус = высоте и ширине иконки */
border:5px solid #fff; /* рамка вокруг иконки */
}



Сохраняете.

Размер иконок можно менять, но в таком случае надо будет подстраивать высоту блока под их новые размеры.

Дана , Вы просто ЗОЛОТО!!!!!!!!!!!!


ОГРОМНОЕ спасибо!!!!!!!!!!!!!

Не за что! Если что — уточняйте про настройки.

Спасибо!
все и так очень даже понятно!!!!
все подписано...
а что не подписано, то не сложно догадаться за что отвечает!!!
Уже настраиваю под свой форум!