Code

Discussion on jQuery Carousel Evolution

Discussion on jQuery Carousel Evolution

Cart 3,440 sales

themekiosk does not currently provide support for this item.

262 comments found.

Hey there,

A quick note to everyone, I spent some time getting this fixed up the way I like.

First off, you CAN add an active class. I modified what Mapalla posted a while ago, and it worked, except when reflections were turned on, since the code would find divs and get confused by the reflection div.

So if you want to add an active class, you’ll need to add this to the before function:

$('.carousel').find('.slides > div').eq( carousel.current ).removeClass('active');

This to the after function:

$('.carousel').find('.slides > div').eq( carousel.current ).addClass('active');

And set the carousel to a variable that you use afterwords, like so, if your variable was carouselVariable:

var carouselVariable = $('.carousel').carousel();
$('.carousel').find('.slides > div').eq( carouselVariable.current ).addClass('active');

Hope that helps out others!

I’m not wanting to use the mousewheel, but if I remove the javascript file, then the script breaks. Any solution to this?

I figured it out. You have to add “mouse:false” to the call before you remove the javascript file. This should be in the documentation.

Hi, I have a big problem with the IE10, I have YouTube Vidoe include in the Carousel, but in the IE10 the Video don’t play in the Carousel, the link go’s to YouTube. Can you halp me? Here are the Link: www.newmoove.com

Hello,

In application, the function “backOpacity” is not compatibility with Firefox v22 ? Home its not working…

We have tested with Firefox 23, and it looks working well

Hi

I have commented if (hiddenSlide < 2){hiddenSlide = 2;}

so all slides are visible, but this changes the animation of the scroll and you can see the slide moving behind the others. Any way of showing all slides (I only have 4 to start with)?

Also is there any way of stopping the slide that is clicked from advancing to the beginning of the carousel?

Thanks

My images are distorted how do I resolve this?

I have visited the page and it looks working well

Take a look at the the distortion of the height and width of the first image here http://jimbolism.com/baron/gallery/1.jpg

you can set the size of the front image through the ‘frontWidth’ and ‘frontHeight’ options

In addition to complete problem in multiple carousel in the same page, the pause function is OK ??only for the last carousel loaded!

Can I see the live page?

Here is an example of what I want to realize : http://www.weedoo.fr/DEBUG/example-dev.htm. The pauseOnHover on the first carousel is appliqued on the second. And I can’t run the button pause correctly ! An idea ?

Hello, Thank’s a lot for this code it’s great. I use it for a website with multiple carousel on the same page and I have a problem to the pause on hover image. Pause is then triggered to the second carousel and not one for which my mouse is hover!

Have an idea?

PS : I’m sorry for the english !

Hello …I have bought this carousel and the Image site is width: 775 and height 457. the number of viewable slides in 5 .. but it shows only 3..

Please help me.. I need to have 5 viewable images and with the same size

the carousel will always hide the last two of the images as part of animation effect. if you have 5 images, it will only show 3 images.

to display all slides, you need to modify the carousel JavaScript files. Open the jquery.carousel.js file then comment out line 278 – 280, like so:

/* if (hiddenSlide < 2){ hiddenSlide = 2; } */

Hey Mapalla,

I just downloaded the files but I can’t find the instructions on how and where to put the codes. Usually it’s easy to find the instruction file but I didn’t see it.

Can you please tell me how to find the instructions?

you can find the documentation inside the download package

Can I use 3 viewable slides and have four rotating images?

yes, you can

Hi there, I’m using fluid/adaptive css with your carousel. When the browser re-size to mobile screen size I would like to hide and stop the animation as well as remove the carousel object. I can hide and stop using api.pause() 1. Is there a way to destroy the api/carousel object? – I do not want to use $(’.carousel’).remove() as I cannot resume 2. When I stop the animation the class .slides loses its height and width 3. When I resume, the dimensions for .slides are not recalculated 4. Pausing and resuming sometimes creates duplicate events firing such as making the carousel slide much faster. If you click on the navigation bullets instead of pausing, it’s still animating

Thanks in advance.

I’m using the module with Vimeo Videos. Works great!

However, how do I make the Vimeo video play automatically as soon as the placeholder image (slide image) is clicked. At present you have to click twice for the video to play.

Mapalla – any update on this one please?? Cheers mate.

Sorry, the carousel does not support that

The drag and drop functionally for ipad there is ? Is it possible to work how skyplugins ?

I try to position the description on a other position than in left top corner of the div.carousel. Only after changing the css-line in the init function of the description like this

.css({'position':'absolute', 'top':'230px', 'text-align':'center', 'width':'100%', 'z-index':'99'});

But I can’t format the css of

inside the description item

like .carousel .description .text p.name { font-size:24px; }

Is there another way to influence the styles inside the description div?

You can do like this:

.carousel .description p
{
    font-family: Arial;
}

Is there a list of all the option parameters?

you can see it in the documentation

Where is that located?

inside the download package

Quick question, Does this have a callback for when an image is clicked and in focus? I know that when you click away it scrolls to the next image, but if the image that is scrolled to is in focus, is there a callback function I can use to execute something when that image is clicked?

It have “before” and “after” options to run functions before and after scrolling. You can see how to use it in documentation.

I’m helping my friend to create a wbesite, but i’m getting problem to insert the PHP CODE of mi jquery carousel evolution in the template source pages for example “header.php”, i want to use this slideshow in “header.php”, and the problem is when i try to copy the code i found only the short code to insert in pages and articles and there isn’t any php code to insert directly in template pages. can somone help me please?

Great Carousel. I wish to know if there’s a possibility to integrate the carousel in a wordpress page. Is it possible?? Thanks!

This is a JavaScript plugin. If you want to integrating it with WordPress, you have to implement it manually into HTML code

There’s a tutorial or a guide that show how and where (which files) to modify the file?thanks_!

Sorry, there is no tutorial how to convert this plugin into a WordPress plugin.

Hi Mapalla

Ive added the carousel to my website and I’m having problems with the animation. My knowledge is very basic and I can’t see what is wrong. I was wondering if you could help Could I email you a link? Thanks in advance. Sjmayer67 (product purchased)

Hello, I need a slide show for my web page and I like this one very much. This is made only for wordpress? My web is not made in wordpress, only coded in dreamweaver and I need to know if I can use this slide show. Thank you

This is a jQuery plugin that you have to implementing it directly into your HTML page

by
by
by
by
by
by

Tell us what you think!

We'd like to ask you a few questions to help improve CodeCanyon.

Sure, take me to the survey