Multiple of same jQuery cycle on the same page?

Hey,

I'm a bit stuck with a problem here.

I try to use multiple jquery cycles (same cycle, with "Pager" function) on the same page. http://malsup.com/jquery/cycle/int2.html (the 4th example).

However, when I try add multiple images to the first one (banksupplies), it adds it to all other portfolio items as well, even though they don't work.



http://agnarson.com/works-web/ (Notice the issue here, only the first portfolio item has multiple images [1,2] but the "pagers" shows up on all of the others as well)


The header code looks like this:

$('.slide')
.after('<div class="select">')
.cycle({
    fx:     'fade',
    speed:   'slow',
    timeout: 0,
    pager:  '.select'
});


And the wordpress custom field template looks like this: (custom fields for the images)

<div class="slide" id="post-<?php echo $page->ID; ?>">
<img src="<?php echo $main_image; ?>" width="604px" height="300px" alt="<?php echo $page->post_title; ?>" />

<?php if ($preview1 != "") { ?>
<img src="<?php echo $preview1; ?>" width="604px" height="300px" alt="<?php echo $page->post_title; ?>" />
<?php } ?>

<?php if ($preview2 != "") { ?>
<img src="<?php echo $preview2; ?>" width="604px" height="300px" alt="<?php echo $page->post_title; ?>" />
<?php } ?>

<?php if ($preview3 != "") { ?>
<img src="<?php echo $preview3; ?>" width="604px" height="300px" alt="<?php echo $page->post_title; ?>" />
<?php } ?>

<?php if ($preview4 != "") { ?>
<img src="<?php echo $preview4; ?>" width="604px" height="300px" alt="<?php echo $page->post_title; ?>" />
<?php } ?>

<?php if ($preview5 != "") { ?>
<img src="<?php echo $preview5; ?>" width="604px" height="300px" alt="<?php echo $page->post_title; ?>" />
<?php } ?>
</div>

I shouldn't need to add a new slideshow in the header for every single new one I add, which is what I would have to do if I gave every post a specific ID. However I'm not good at jQuery, so I have no idea what to do here.

• Topic Participants

• alexandersz