A better way to approach this is to wrap the images in divs and then
cycle the divs.  You can then count on it working correctly for all
the transition effects.

http://jquery.malsup.com/cycle2/center-horz.html

Mike


On Oct 17, 4:25 pm, David Collins <floyd1...@gmail.com> wrote:
> I didn't see this as an option, so I decided to give it a try on my
> own.  I was able to add some lines of code (shown with the > in the
> margin below) to the jquery.cycle.js script to read in the width of
> each image and center the slide within the slideshow container
>
>     // set position and zIndex on all the slides
>
> >    // read in each image's width and center it wrt the slideshow width
> >    $slides.each(function(i){
> >        var imgwidth = $(this).attr("width");
> >        $(this).css('left', (opts.width-imgwidth)/2);
> >    });
>
>         $slides.css({position: 'absolute', top:0}).hide().each(function(i)
> {  // removed the "top" value since it is being defined above
>                 var z = first ? i >= first ? els.length - (i-first) : first-i 
> :
> els.length-i;
>                 $(this).css('z-index', z)
>         });
>
> This works great for images that are pre-defined in the markup, but
> when I use the addSlide option, the newly added slides do not get
> modified in the above code.  Any suggestions on where I can put this
> chunk of code so that it gets run *after* the slides are added to the
> slideshow?  Should I get the img width and define the left position
> for each slide during the actual cycle function, or maybe during the
> "// reset common props before the next transition" section?
>
> Any help would be appreciated.
>
> Thanks,
>
> -David

Reply via email to