Version 0.7.4-5 not working when instantiated per instructions

[mackinven]

Firstly, thanks for providing this excellent carousel.

Secondly, It's entirely possible I am doing something incorrect, and there isn't an issue.

However, after trying everything I can think of, including suggestions from the author via email (thank you for taking the time to reply to me), I am stumped.

I have uploaded the bare-bones carousel to:http://mackinven.com/carousel/demo.html

The only change from the official demo is that I have removed the complex script that interacts with the various form fields and allows for many configuration options to be explored.

This has been replaced with the instantiate method suggested by the carousel author:

$(document).ready(function() {
     $('#my-carousel-1').carousel({
            autoScroll: true,
            pause: 1000 // optional, defaults to 8000
        });
    });

As can be seen in the link to my modified version, parts of the carousel work, the pagination and prev/next buttons animate every 1000ms, but the carousel does not move. I have l tried adding other parameters, such as itemsPerPage, but this is not picked up by the carousel either.

As mentioned this may all be a product of my own stupidity, and I apologise if I have missed something obvious. The official demo of the current version (0.7.4-5) works very nicely, however it is not practical to implement with the myriad of configuration options available on screen.

An example 'real world' implementation from the author would be a great resource.

Many thanks,

Lachlan

[richardscarrott]

The reason it's not working is because of the 'no-js' class in the body element. If you remove it it'll work fine.

The reason the class is there in the first place is to fight the 'Flash Of Unstyled Content' (FOUC) when writing styles to ensure the carousel gracefully degrades for users without JS, if you're interested this will explain the concept a little more: http://paulirish.com/2009/avoiding-the-fouc-v3/

I've every intention of creating some more approachable examples but it's just a case of finding the time.

Cheers, Rich

[mackinven]

Richard,

Thank you, it works like a dream!

I really appreciate the time you have taken getting back to me. I provide some free Joomla templates over at my site http://joomlabear.com/, and the number of hours I have spent answering people's Q's... I know how taxing it can be. I'm just a humble designer/HTML/CSS guy, need to expand and get my hands dirty with some jQuery.

Also, had a look at your recent projects; Burberry and David Yurman, very impressed!

Kind regards,

Lachlan

On Fri, Sep 30, 2011 at 2:17 AM, Richard Scarrott < reply@reply.github.com>wrote:

The reason it's not working is because of the 'no-js' class in the body element. If you remove it it'll work fine.

The reason the class is there in the first place is to fight the 'Flash Of Unstyled Content' (FOUC) when writing styles to ensure the carousel gracefully degrades for users without JS, if you're interested this will explain the concept a little more: http://paulirish.com/2009/avoiding-the-fouc-v3/

I've every intention of creating some more approachable examples but it's just a case of finding the time.

Cheers, Rich

Reply to this email directly or view it on GitHub:

https://github.com/richardscarrott/jquery-ui-carousel/issues/10#issuecomment-2244468

http://mackinven.com/

I'm Lachlan MacKinven; graphic designer, web developer, tech specialist and all-round nice guy. You can find out what I'm up to now at mackinven.com.