Comments on: jQuery Cycle with carousel thumbs pager

By: mihai

mihai — Fri, 03 May 2013 13:32:53 +0000

Hi,

This problem appears because of how jCarousel works in circular mode.
If you look at the HTML of the carousel items when in circular mode, you will see that jCarousel doubles them, in order to achieve the circular effect. This messes all up, because the slideshow and the carousel will no longer be synchronized.

I don’t know right now if is possible to make this work with the carousel in circular mode, unless you find a carousel plugin that won’t affect the number of items when running in circular mode.

By: Alvina

Alvina — Thu, 02 May 2013 11:57:24 +0000

Thanks for the code! Works great.
I do have a question though. I’ve changed the code a little bit to have the carousel auto start en circle around.

$(“.slider-pager”).jCarouselLite({
btnNext: “#pager_next”,
btnPrev: “#pager_prev”,
auto: 5000,
circular: true,
visible: 4
});

I want to use the ‘activeSlide’ class provided by the cycle plugin. When I change circular to false then it works correctly (I have a border on the current slide). When I say that circular is true I only have a border on the first item but not the rest.

Would you be able to tell me how I can make this work?

By: mihai

mihai — Sun, 14 Apr 2013 11:11:48 +0000

Yes, it works.
Check the demo again, now is running with jQuery 1.4.2.

By: biplab

biplab — Tue, 09 Apr 2013 11:04:01 +0000

Hi, i was trying to use it with jquery 1.4.2, but it does not work. Could you please let me know if i this can be done.

By: mihai

mihai — Tue, 09 Apr 2013 09:50:46 +0000

I’m glad my article helped you.
Who knows, maybe some article of your will help me someday.

By: Ahmed

Ahmed — Sat, 06 Apr 2013 20:05:26 +0000

i was looking for this style of slider and got what i want , Thank You very very very much .

i wish if i can help you in the future to return this favor :)

By: mihai

mihai — Wed, 31 Oct 2012 07:12:38 +0000

I think this is due to the overflow: hidden; of the modal container.
I haven’t used simplemodal, but you should try to set the height and optionally the width to the simplemodal, in order to force the modal to show all your inner elements.

$(“#element-id”).modal({ minHeight: ‘350px’, minWidth: ‘350px’ });

I hope it helps.

By: Mario

Mario — Sun, 28 Oct 2012 07:22:49 +0000

Hello, I use your code and it’s works very fine. Now I wont to show the gallery in one Overlay (like simplemodal) – but the thumbs at the jcarousell not shown – can you help me?
Sorry for this bad english ….