Swipeview - pokaż podgląd/fragment następnego elementu?

Question

Używam Swipeview (http://cubiq.org/swipeview), aby utworzyć dotykowy carousel działający na iPhone i Android. Podstawy działają świetnie.

Mój problem zaczyna się, gdy próbuję go wyświetlić, aby pokazać 25% następnej wartości domyślnej slajdu. Chodzi o to, że użytkownik może zobaczyć 1/4 następnego slajdu/obrazu, co powinno spowodować przesuwanie obrazu w celu odsłonięcia następnego slajdu/obrazu. Pierwszy obraz następnie znika, drugi obraz staje się w 100% widoczny, wyrównany w lewo, a trzeci obraz jest następnie widoczny o 1/4. I tak dalej.

Próbowałem zmienić div.style.cssText (w swipeview.js), aby uzyskać szerokość 75% zamiast domyślnej 100%. Działa to dla początkowego obciążenia, ale kiedy przewijam, część drugiego obrazu, która była widoczna na slajdzie 1, jest teraz ukryta na slajdzie 2.

Zrobiłem skrzypce, aby zademonstrować: http://jsfiddle.net/zeqjN/1/ (przetestuj w Chrome i spróbuj przeciągnąć obraz w lewo)

Jakieś pomysły, w jaki sposób mogę zmodyfikować swipeview.js, aby dopasować się do moich potrzeb?

Answer 1

Można to osiągnąć tylko za pomocą css. Po prostu dodaj efekt skali do przedmiotów.

.scroller .scroll-item { float: left; -webkit-transform: scale3d(1.1,1.1,1.1) } 

Check out: http://jsfiddle.net/frapporti/Xt9dM/