html - iosSlider CSS设置问题以进行响应式设计

我下载了iosSlider演示，并尝试修改其中一个示例。

iosSlider-https://iosscripts.com/iosslider/
按红色大按钮下载演示。

我要修改的index.html位于iosslider_demos_examples \ 9-Full-Width-Responsive-Height \ 3-variable-width \文件夹中。

这是之前代码的原始部分：

                <div class = 'slider'>

                    <img src = 'http://placehold.it/400x400/ff00cc/' />
                    <img src = 'http://placehold.it/300x400/ffcc00/' />
                    <img src = 'http://placehold.it/200x400/ccff00/' />
                    <img src = 'http://placehold.it/400x400/cc00ff/' />
                    <img src = 'http://placehold.it/100x400/00ccff/' />
                    <img src = 'http://placehold.it/500x400/00ffcc/' />

                </div>

这是我修改它并添加带有类的DIV元素后的外观：

                <div class = 'slider'>

                    <div class = 'item'>
                        <img src = 'http://placehold.it/400x500/ff00cc/' />
                    </div>
                    <div class = 'item'>
                        <img src = 'http://placehold.it/300x400/ffcc00/' />
                    </div>
                    <div class = 'item'>
                        <img src = 'http://placehold.it/200x400/ccff00/' />
                    </div>
                    <div class = 'item'>
                        <img src = 'http://placehold.it/400x400/cc00ff/' />
                    </div>
                    <div class = 'item'>
                        <img src = 'http://placehold.it/100x400/00ccff/' />
                    </div>
                    <div class = 'item'>
                        <img src = 'http://placehold.it/500x400/00ffcc/' />
                    </div>

                </div>

一旦执行此操作，滑块将无法正常工作。我怀疑我需要修改滑块的CSS，但是我不知道如何。有什么建议么？

如果您有任何想法请告诉我。我将不胜感激。

最佳答案

您是通过JS启动插件的吗？
像这个例子：

jQuery(document).ready(function($) {
		/* items_slider */
		$('.slider-marcas .gbtr_items_slider').iosSlider({
			snapToChildren: true,
			desktopClickDrag: true,
			scrollbar: true,
			scrollbarHide: true,
			scrollbarLocation: 'bottom',
			scrollbarHeight: '2px',
			scrollbarBackground: '#ccc',
			scrollbarBorder: '0',
			scrollbarMargin: '0',
			scrollbarOpacity: '1',
			navNextSelector: $('.slider-marcas .gbtr_items_sliders_nav .big_arrow_right'),
			navPrevSelector: $('.slider-marcas .gbtr_items_sliders_nav .big_arrow_left')
		});
	});

关于html - iosSlider CSS设置问题以进行响应式设计，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/18788777/