JQuery Slideshow

Associate
Joined
13 Jan 2007
Posts
2,424
Location
Belfast,Northern Ireland
I've implemented this and similar before and cannot work out why the hell its not working properly! This is a functioning version: http://flowplayer.org/tools/demos/tabs/slideshow.html

My version: www.warfinder.co.uk

I have included the jquery library and tools at the top:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script src="http://cdn.jquerytools.org/1.2.5/jquery.tools.min.js"></script>

All markup is included, correctly too as its swiped from the demo and matches their standalone effort.

The css links correctly as images appear, I know some buttons etc not appearing is due to the image reference to somewhere that doesnt exist . And the background is different as I deleted it and made some minor changes.

Finally the javascript is included before the body closes and within script tags.

Surely that is everything covered? Im guessing the javascript is not functioning correctly but it is exactly what they say in their demo version
 
Last edited:
Look at their demo CSS. It controls what is seen and how much of it. It's fiddly, but just debug it all and it'll get working

http://static.flowplayer.org/tools/css/tabs-slideshow.css

A straightforward copy wont work. You have different widths and styling of elements. You need to alter the CSS to fit yours.

If you wish to test it. I'd recommend setting up a blank HTML page with jQuery and that script and work from there. it can be less confusing.
 
I realise the styling and such is an issue but it appears to be working okay, css wise anyway? Obviously I need to tailor it to fit much better and create new buttons etc but I was aiming to get it working first. Its more the javascript isnt functioning?
 
I would have used a scrollable instead of tabs myself..
http://flowplayer.org/tools/scrollable/index.html

However, your navi is working. The prev and next are not working because you have the wrong classes on them. Inspect the ones on the following example .
http://flowplayer.org/tools/demos/tabs/slideshow.html

Your slideshow isn't working because you're using the base version of jquery tools, which only includes the basics, not the additional plugins. You can either use the full version, or build your own which only includes the plugins you need.
http://flowplayer.org/tools/download/index.html

Lastly, you've got jquery and jquery tools linked in there, but the jquery tools you're linking to already includes the jquery library, so you're essentially adding it in twice.
Personally, when using jquery tools, I always build my own to only include what I need it to. I never let it include jquery itself as I prefer to keep it separate so it's easier to change when an update comes out.
 
Last edited:
Ah cheers tripnologist, the jquery linking was exactly the problem. I didnt download the exact one I needed as the downloads section wasn't working yesterday. Oddly enough it works if I link the full tools + jquery library CDN but not using the google library link and including the plugins i need via a script folder. However I know the problem now so confident i'll get it working.

Thanks
 
Back
Top Bottom