html - How do I modify the jQuery cycle plugin for a two image slideshow instead of one? -
The idea of a slide show looks like this: Except that instead of three there are two images.
Apart from this
It is what I have to make.
However, when you press 'Next' and 'Previous', I want to move each image to second place and vice versa. The code will look something like this:
& lt; Div id = "slideshow" width = "100%" & gt; & Lt; Div class = "slide" & gt; & Lt; Img src = "image1.jpg" width = "43%" & gt; & Lt; Img src = "image2.jpg" width = "43%" & gt; & Lt; / Div & gt; & Lt; Div class = "slide" & gt; & Lt; Img src = "image3.jpg" width = "43%" & gt; & Lt; Img src = "image4.jpg" width = "43%" & gt; & Lt; / Div & gt; & Lt; / Div & gt;
jQuery looks like this:
$ ('#slideshow'). Circle ({fx: 'wipe', timeout: 0, prev: '# left-arrow', next: '# right-arrow',});
stylesheet:
#slideshow {overflow: hidden; }
It seems, when you press 'Next' (or 'right-arrow' in this case) - and you are in the original position of the slideshow, what should be the image2 image Slide to position 1, and image 3 is now visible where image2.
Press again, this rotate is in progress and now images 1 and 2 are no longer visible.
Press the previous and it goes back sequentially.
How do I modify this plugin for that functionality?
I tried many different things in which each image was on different slides - but my implementation never worked.
Any thoughts?
Try jCarousel or jCarouselLite for this behavior.
Comments
Post a Comment