2012-06-22 11 views
8

मैं एक आईफोन और एंड्रॉइड पर काम कर रहे एक स्पर्श-सक्षम carousel बनाने के लिए Swipeview (http://cubiq.org/swipeview) का उपयोग कर रहा हूं। मूल बातें महान काम करती हैं।स्वाइपव्यू - अगले आइटम का पूर्वावलोकन/स्निपेट दिखाएं?

मेरी समस्या तब शुरू होती है जब मैं इसे अगले स्लाइड पीआर डिफ़ॉल्ट के 25% दिखाने के लिए प्राप्त करने का प्रयास करता हूं। विचार यह है कि उपयोगकर्ता अगली स्लाइड/छवि के 1/4 को देख सकता है, जिसके बाद उन्हें अगली स्लाइड/छवि प्रकट करने के लिए छवि को स्लाइड करना चाहिए। पहली छवि तब अपमान करती है, दूसरी छवि बाईं ओर गठबंधन, 100% दिखाई देती है, और तीसरी छवि तब 1/4 से दिखाई देती है। और इसी तरह।

मैं div.style.cssText (swipeview.js में) बदल रहा है डिफ़ॉल्ट 100% के बजाय 75% की चौड़ाई के लिए कोशिश की है। यह प्रारंभिक लोड के लिए काम करता है, लेकिन जब मैं स्क्रॉल करता हूं, स्लाइड 1 पर दिखाई देने वाली दूसरी छवि का हिस्सा अब स्लाइड 2 पर छिपा हुआ है।

मैंने प्रदर्शित करने के लिए एक पहेली बनाई: http://jsfiddle.net/zeqjN/1/ (इसे क्रोम में जांचें और छवि को बाईं ओर खींचने का प्रयास करें)

कोई विचार है कि मैं अपनी आवश्यकताओं के अनुरूप swipeview.js कैसे संशोधित कर सकता हूं?

+0

इस तरह? http://dimsemenov.com/plugins/royal-slider/visible-nearby/ – Varinder

उत्तर

0

आप इसे केवल सीएसएस के साथ प्राप्त कर सकते हैं। बस वस्तुओं पर एक पैमाने पर प्रभाव जोड़ें।

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

की जाँच करें: http://jsfiddle.net/frapporti/Xt9dM/

संबंधित मुद्दे