jquery custom slider not showing the rest of the images

[ajnoguerra]

I’m trying to create my version of an image slider but its not working as I want it to be. I have 3 sample images that should slide from right to left. But it doesn’t show up the third image. Please see this codepen

Is there a work-around for this?

[thechrisroberts]

I forked your pen and have it working more or less the way I think you wanted: http://codepen.io/thechrisroberts/pen/Bfmhe

Several of the changes were just cleaning up unnecessary code, but the critical part was removing extraneous timers. You had:
* A delay when the first image appears, hiding it after 5.5 seconds
* A timer loop controlling your actual slides, running every 3 seconds
* Another delay of 5.5 seconds before hiding the next image
Etc, etc.

In short, the loops were tripping over each other.

The jQuery UI slide effect is really not the best way to do something like this, especially since it apparently can’t handle sliding something in while sliding something out. It would be better to use jQuery animate() and write your own logic for sliding in and out. That is especially necessary since you plan to have a prev and next button.

[Author]

Posts