समस्याग्रस्त छवि कैरोसेल लपेटें-आसपास

Question

कैरोसेल अच्छी तरह से लपेटता नहीं है।

यदि मैं सही क्लिक करता रहता हूं, तो आखिरी छवि जो दिखाएगी वह सबसे पहले होगी। फिर मुझे चार बार क्लिक करना होगा, जिस बिंदु पर यह छवि कैरोसेल के बहुत ही बाईं ओर होगी। दाईं ओर कोई छवियां नहीं दिखायी जाती हैं। फिर अचानक वे सब एक बार में दिखाई देते हैं। यह तब होता है जब कैरोसेल शुरू होता है।

मैं उम्मीद थी कि "संक्रमण 2" फ्रेम सही पक्ष पर होता है "Img # 2", और इतने पर।

मैं

• की कोशिश की है या बंद
• अनंत बंद या
• slidesToShow सेटिंग के साथ नगण्य पर स्थापित करने मोड़, और बढ़ रही है यह मदद कर सकते हैं पर स्थापित करने ऑटोप्ले मोड़, लेकिन जब से मैं परिवर्तनीय चौड़ाई है छवियों और एक उत्तरदायी डिजाइन, यह सेटिंग छोटी स्क्रीन
• पर नवीनतम क्रोम और एफएफ

पर छवियों की केवल एक छोटी राशि दिखाएगी

मैं slick.js 1.5.8 का उपयोग कर रहा निम्न सेटिंग के साथ:

$("#myslick").slick({ 
    autoplay: true, 
    variableWidth: true 
    }); 

निम्न HTML के साथ

(चालाक हिंडोला एक बूटस्ट्रैप 3 कंटेनर के भीतर है):

<div class="container"> 
    <div id="myslick"> 
     a few <img> tags with variable dimensions 
    </div> 
</div> 

मैं का उपयोग सीएसएस विषय फ़ाइलें शामिल है, लेकिन जोड़ लिया है निम्नलिखित

.slick-slide { 
    height: 100px; 
    margin: 0 15px; 
} 

Answer 1

मैं चालाक हिंडोला से परिचित नहीं हूँ, लेकिन मैं बनाने के द्वारा संभव के रूप में के रूप में कई अज्ञात को दूर करने का सुझाव देते हैं बिना किसी बूटस्ट्रैप या बाहरी कस्टम सीएसएस के स्लॉट कैरोसेल शामिल हैं। यदि आपको बूटस्ट्रैप/कस्टम सीएसएस के बिना इच्छित कैरोसेल काम करना है, तो आप जानते हैं कि कुछ सीएसएस स्लिम के साथ संघर्ष कर रहा है। अन्यथा, आपके स्लिम सेटअप के साथ कुछ गलत होना चाहिए।

मुझे यकीन है कि आप सभी कॉन्फ़िगरेशन विकल्प चालाक है के माध्यम से देखा है हूँ ... http://kenwheeler.github.io/slick/

इसके अलावा, ऐसा लगता है चालाक की तरह कुछ महान का उपयोग करता है, लेकिन मैं का उपयोग कर सफलता का एक बहुत कुछ मिला है बूटस्ट्रैप कैरोसेल। अगर स्लिम काम नहीं करता है तो कोशिश करने लायक हो सकता है।

Answer 2

स्लिक में slidesToShow सेटिंग है जो डिफ़ॉल्ट रूप से 1 है। आप उस सेटिंग को "3" में बदलना चाहते हैं। http://kenwheeler.github.io/slick/ जो इस कोड है: "कई आइटम" यहाँ की स्थापना की जाँच करें

$('.multiple-items').slick({ 
infinite: true,  // Keep on looping 
slidesToShow: 3, // Number of slides to show at one time 
slidesToScroll: 3 // Number of slides to scroll per click 
});