I am using Swipeview
(http://cubiq.org/swipeview) to create a touch-enabled carousel
working on an iPhone and Android. The basics works great.
My problem starts when i try to get it to show 25% of the next slide pr default. The idea is that the user can see 1/4 of the next slide/image, which should then make them slide the image to reveal the next slide/image. The first image then disapears, the second image becomes 100% visible, aligned to the left, and the 3rd image is then visible by 1/4. And so on.
I have tried changing the div.style.cssText
(in swipeview.js
) to have a width of 75%
instead of the default 100%
. This works for the initial load, but when i scroll, the part of the 2nd image that was visible on slide 1, is now hidden on slide 2.
I made a fiddle to demonstrate: http://jsfiddle.net/zeqjN/1/ (test it in Chrome and try dragging the image to the left)
Any ideas as to how i can modify swipeview.js
to fit my needs?