Home/ Questions/Q 822201
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-15T02:45:55+00:00

I’m using the jQuery cycle plugin to create multiple slideshows on a single page

  • 0

I’m using the jQuery cycle plugin to create multiple slideshows on a single page (which, once I get this problem figured out, will be started/stopped by mouse hover — yeah, I know there are 9 slideshows on the page).

Problem is, when I tell more than one slideshow to start cycling, whichever ones I call cycle() on get superimposed. So, all the images from slide 1 are superimposed, then they all transition to slide 2, etc. I can tell they’re being superimposed because the first slide of each slideshow contains a transparent PNG.

This happens whether I call cycle() in a jQuery each() iterator, or even if I call it by hand on just two or three of the containers with a jQuery id selector.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Just add this to your CSS:

    .column { position: relative }

    The Cycle plugin is setting an absolute positioning on the slideshows, which will be in relation to the first parent element that has either position: relative or position: absolute. So by setting position: relative on the .column class, it contains the slideshow to its 0,0 coordinates and subsequently keeps them from overlapping each other.

    • 0