Swipeview - hiển thị xem trước/đoạn trích của mục tiếp theo?

Question

Tôi đang sử dụng Swipeview (http://cubiq.org/swipeview) để tạo một cảm ứng được bật carousel hoạt động trên iPhone và Android. Các khái niệm cơ bản hoạt động rất tốt.

Sự cố của tôi bắt đầu khi tôi cố gắng hiển thị 25% giá trị mặc định của trang trình bày tiếp theo. Ý tưởng là người dùng có thể nhìn thấy 1/4 của slide/hình ảnh tiếp theo, sau đó sẽ làm cho họ trượt hình ảnh để tiết lộ slide/hình ảnh tiếp theo. Hình ảnh đầu tiên sau đó sẽ biến mất, hình ảnh thứ hai trở thành 100% có thể nhìn thấy, căn chỉnh bên trái, và hình ảnh thứ 3 sau đó có thể nhìn thấy bằng 1/4. Và cứ thế.

Tôi đã thử thay đổi div.style.cssText (trong swipeview.js) để có chiều rộng 75% thay vì mặc định 100%. Điều này làm việc cho tải ban đầu, nhưng khi tôi cuộn, phần của hình ảnh thứ 2 hiển thị trên trang trình bày 1, hiện bị ẩn trên trang trình bày 2.

Tôi đã thực hiện một cách giải thích: http://jsfiddle.net/zeqjN/1/ (thử nghiệm trong Chrome và thử kéo hình ảnh sang bên trái)

Bất kỳ ý tưởng nào về cách tôi có thể sửa đổi swipeview.js để phù hợp với nhu cầu của tôi?

Answer 1

Bạn chỉ có thể thực hiện điều này bằng css. Chỉ cần thêm hiệu ứng quy mô vào các mục.

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

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