0

I am using the supersized plugin: http://buildinternet.com/project/supersized/docs.html#api_docs

But it is troubling me, the documentation is not very clear or not to me at least. I am trying to load different images via my menu items, the doc says to insert the following but I do not understand where I should be adding this:

$(element).click(function(){
api.nextSlide();
});

I tried to put it anywhere with no luck, anyone?

rob.m
  • 9,843
  • 19
  • 73
  • 162
  • possible duplicate of [How to move to next slide programatically?](http://stackoverflow.com/questions/8728390/how-to-move-to-next-slide-programatically) – nikc.org Jan 04 '12 at 17:04
  • 1
    @nikc.org - No. This is a continuation of that question. – techfoobar Jan 04 '12 at 17:22
  • @user1018804 - You're welcome. The haven't really mentioned what the hell the 'api' object is, where it is created etc.. I'm puzzled too. Let me dig deeper. – techfoobar Jan 04 '12 at 17:27
  • thank you very much, if you can solve it you'll be my new 2012 hero! :) – rob.m Jan 04 '12 at 17:29
  • If you open their demo - http://buildinternet.com/project/supersized/slideshow/3.2/slide.html - Open your Firebug console and execute `window.api.nextSlide()` - you'll see it works as expected. So they are creating the api object globally as a direct member of the window object (which isn't very neat IMO) – techfoobar Jan 04 '12 at 17:31
  • the creator replied once on a post here on stack, giving some more insights but nothing too clear still: http://stackoverflow.com/questions/6904154/how-do-i-use-this-api-of-supersized-jquery-plugin – rob.m Jan 04 '12 at 17:31
  • Which means it should work the way you've coded it! :) Can you share a link to the page you're working on, the issue might be something else. – techfoobar Jan 04 '12 at 17:32
  • Observations so far. Supersized is indeed being initialized correctly. Its slide animation is indeed running (the li attributes keep changing every few seconds). Also the api object is correctly defined, calling api.nextSlide does something (but nothing visual is seen). Has to be something to do with the display setting of the lis.. – techfoobar Jan 04 '12 at 18:01
  • Well, it each slide transition the plugin attempts to add css classes like quality, prevslide, activeslide etc.. But i cannot find those css classes. Have you missed adding any css files that came with supersized? Looks like thats the issue here. – techfoobar Jan 04 '12 at 18:06
  • thing is, I haven't specified the $(element).click(function(){ api.nextSlide(); }); – rob.m Jan 04 '12 at 18:07
  • 1
    Yes, thats there. But even otherwise the slide transitions will not work till you add the css classes namely prevslide, activeslide tc.. that some as part of supersized.css .. Once that css is added binding the click will work correctly. – techfoobar Jan 04 '12 at 18:09
  • 1
    you were right!!!! it now works!! I was missing the css indeed! and guess why? because the guy has an odd "latest version" link which i missed so I downloaded the old version with the old css and files, before i had realised that and downloaded the correct one but only uploaded the new js files and didn't think of the css! Thank you very much, you are my new 2012 hero indeed!! – rob.m Jan 04 '12 at 18:13

1 Answers1

0

I had to include any css files that came with supersized. And i missed them, that what the issue was.

rob.m
  • 9,843
  • 19
  • 73
  • 162