Zgaduję, że chodzi Ci o animowanie bannerów, a nie o losowe ich pobieranie z jakiegoś katalogu.
To dosyć stary kod, nie jest najładniej napisany, ale robi to, co powinien.
Stwórz plik slider.js w katalogu jscripts na forum. Tutaj zawartość:
http://wklej.to/JtgGN/text
Skrypt przygotowany jest dla bannerów o szerokości 468 pikseli. Jeśli używasz innej, to pozamieniaj liczby w powyższym kodzie.
Następnie w interesującym Cię szablonie (np. header) dodaj kod (styl jest dostosowany do konkretnego szablonu, więc pewnie będziesz go musiał trochę dopasować pod siebie):
<div id="slider" style="position: relative; width: 468px; float:right; right: 80px; top: -5px;">
<div id="slid_img" style="width: 468px; height: 60px; position: relative; overflow: hidden; padding: 0; border: 1px solid #131313;">
<a href="http://pukawka.pl/" style="position: absolute; top: 0px; margin-left: 0px;" id="slid_img1"><img src="http://pukawka.pl/img/pp/BANER468.gif" alt="" title="pukawka.pl"></a>
<a href="http://pukawka.pl/" style="position: absolute; top: 0px; margin-left: 468px;" id="slid_img2"><img src="http://pukawka.pl/img/pp/BANER468.gif" alt="" title="pukawka.pl"></a>
<a href="http://pukawka.pl/" style="position: absolute; top: 0px; margin-left: 468px;" id="slid_img3"><img src="http://pukawka.pl/img/pp/BANER468.gif" alt="" title="pukawka.pl"></a>
</div>
<div id="slid_menu" style="margin-left: 370px; margin-top: 5px;">
<a href="#" id="slid_1" class="slactive"> </a>
<a href="#" id="slid_2"> </a>
<a href="#" id="slid_3"> </a>
</div>
</div>
Następnie do swojego szablonu headerinclude przed zmienną {$stylesheets} zaincluduj skrypt:
<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/slider.js"></script>
Jeśli nie masz na forum dodanego jQuery to przed powyższą linijką dodaj jeszcze:
<script type="text/javascript" src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
<script type="text/javascript">jQuery.noConflict();</script>
Potem do arkusza global.css dodaj:
#slid_1, #slid_2, #slid_3{
background: url(images/NAZWATWOJEGOSTYLU/slider_img.png);
display: block;
float: left;
width: 18px;
height: 18px;
margin-right: 10px;
}
.slactive{
background: url(images/NAZWATWOJEGOSTYLU/slider_img.png) 0px 18px !important;
}
i wrzuć do katalogu z obrazkami swojego stylu plik z załącznika.
I to chyba wszystko, czego potrzebujesz.
