2013-09-03, 05:34 PM
Hi all. Today i wanted to include a nice slider into my forums based on prototype. I've choosen Protoshow - http://www.protoshow.net/ and i have a problem. This slider won't work properly on my forums because it shows only the first image and nothing happens after that.
My code from headerinclude
My code from header (note, slider is a custom class)
What im doing wrong? Thanks for any help in advance!
My code from headerinclude
<!-- Slider -->
<link rel="stylesheet" href="{$mybb->settings['bburl']}/jscripts/protoshow.css" media="screen" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/prototype/1.7.0.0/prototype.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/scriptaculous/1.8.3/scriptaculous.js"></script>
<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/protoshow.js"></script>
My code from header (note, slider is a custom class)
<div class="slider">
<div id="myshow"><!-- protoshow container -->
<ul class="show"><!-- slideshow itself -->
<li class="slide"><img src="{$theme['imgdir']}/slider/slide01.jpg" /></li>
<li class="slide" style="display: none"><img src="{$theme['imgdir']}/slider/slide02.jpg" /></li>
<li class="slide" style="display: none"><img src="{$theme['imgdir']}/slider/slide03.jpg" /></li>
<li class="slide" style="display: none"><img src="{$theme['imgdir']}/slider/slide04.jpg" /></li>
</ul>
</div>
</div>
<script type="text/javascript">
document.observe('load', function() {
// reference ID of our show container
var show = new protoShow('myshow');
});
</script>
What im doing wrong? Thanks for any help in advance!