Feed on

I’ve released an small update to the jQuery plugin Infinite Carousel 2. As reported by Ervin, there was a bug triggered by small transition times that caused the carousel to behave erratically. It turns out that this was caused by a race condition created by the captions and this has now been fixed and the plugin works as it should now with any transition time.

Click here to grab version 2.0.1, or you can always go to the CatchMyFame plugins page where I list all of the latest version of my plugins. The demos are all using the latest version which you can see here.

20 Responses to “Infinite Carousel 2 Updated”

  1. Stephan says:

    First, well done for this carousel plugin, it is terrific !
    Anyway, I have an issue on my site, but I don’t know if it’s my integration or the bug is in the plugin.
    At first, it seems everything is behaving normally, but after a while the thumbnails don’t refer to the proper image.
    You can see this behavior there http://www.umi-bulle.fr/graphisme/article/portfolio-de-sites
    Any idea of what’s happening?

  2. mitica says:

    Is is possible to call the moveRight() / moveLeft() function from my own js?
    How can I make those functions visible to my main js?

    Thank you

    • admin says:

      Possible? Sure, anything’s possible. You’d probably need to turn the functions into public functions so you could call them from outside any objects created. This might prevent you from creating multiple instances on a page since a call to the public function would trigger the action on all instances.

      • mitica says:

        Great! Thank you for your reply.
        Also, thank you for posting this great plugin. I am using it and I love it!

  3. mitica says:

    I am trying to use jQuery draggable with the elements of the infiniteCarousel.
    All works fine, except the last element.
    Can you please suggest a solution or a code region to look for the problem?

    Thank you

    • mitica says:

      Testing I found out that for the last image in the list, getting the offset returns 0,0.
      This is not happening for the rest of the images.
      function dragStart(e, ui)
      startPos = $(this).offset();

      I know that this has to do with the fact that it is an infinite carousel and this pops the following question:
      Is it possible to make the carousel stop at the last image? (to disable the infinite feature)

  4. Richard says:

    I was trying to use your piece in my page but it seems to conflict with another style sheet that uses ul, li for the navigation links. It overrides them and makes them appear second in my page. I have in my masterpage the navigation but it overrides the header. I am using the navigation form this site. http://www.stunicholls.com/menu/pro_drop_2.html. Any ideas on what could be causing it?

  5. Richard says:

    I got it…now my issue is finding how to center the thumbnails.

  6. Carrie says:

    I love this script, but I want to know how to customize the transition. Is it possible to have it “fade” between images instead of “sliding”? Please email me / comment if this is possible. Thank you!

    • admin says:

      Carrie, you’re referring to an image fader, not a carousel. They work very differently and a fader is far easier to code than a carousel.

  7. jeerrey says:


    The above link is a site I am building for someone. I love the carousel, but when I installed it, it jacked up my horizontal menu (Kwicks). On the other pages, the menu is still fine, I am just wondering if there is a simple solution to this. I am not the best with javascript just yet, but am working hard on it, and want to thank you and others for helping out by posting tutorials.

  8. admin says:

    You have to define jquery before your calls to other scripts.

  9. Anthony says:

    I love your infinite carousel. I have two questions. How can I change the images of the thumbnails like for example using the rel attribute, and second is there also a way in changing the previous and next button with the ones that I will slice from my psd?

    Thanks in advance

  10. Helen says:

    Wonderful job on your Carousel :)

    I am using the carousel div inside another div which has a background image as a frame. However, the carousel images are not sliding properly. There is a gap between images and the images are cutoff.

    Can you please advise how to use your creation inside another div with a background image?

  11. Clinton says:

    Hi, really liking this carousel, i was just wondering if you’ve implemented a version of this with a fade transition rather than slide transition? Also is it possible to hide the left and right arrows completely, and just use the thumbs as navigational control?


  12. Rajesh says:

    Your carousel is very interesting and useful and easy to implement. The most useful thing is it can be used multiple times on a single page with different ids, great work. Really love it. The one issue I could find is that it is not showing the next/prev, play/pause buttons. I think it should display default or what should I do to turn it on?

  13. Doug says:


    Love the carousel – but am having an issue with the thumbnails.
    On the test page I use to play with this sort of code, it works fine: http://dougparkermarketing.com/spasalon/
    On the test page for an actual client, the thumbnails are waaaay down south: http://www.happytalespublishing.com/books/carousel-test.html

    Not sure what the heck is going on here. Any help would be appreciated.

  14. rct says:

    Hi it’s the best display carousel with thumbnails that I’ve seen posted. I have a question; if i would like the placeholder to appear minimized instead of maximized, so they have the option to maximize if they want, but appear minimized initally, what i have to do?

  15. rct says:

    Sorry for my last comment I used placeholder, nut i meant textholder

    Hi it’s the best display carousel with thumbnails that I’ve seen posted. I have a question; if i would like the textholder to appear minimized instead of maximized, so they have the option to maximize if they want, but appear minimized initally, what i have to do?

Leave a Reply

You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>