bxslider 无法响应 100% 宽度答案

【问题标题】：bxslider trouble making responsive 100% widthbxslider 无法响应 100% 宽度
【发布时间】：2015-11-06 16:58:23
【问题描述】：

我正在尝试不同的轮播（jcarousel、bxslider、owl carousel 2）.. 现在我正在使用 bxslider，但我无法让它响应。

网址：http://topforexbroker.net/hund/

bxslider 选项 (http://bxslider.com/options)：

                minSlides: 1,
                moveSlides:1,
                maxSlides: 8,
                slideWidth: 275,
                slideMargin: 10,
                pager: false

在移动设备上预览：

如果我增加 slideWidth，它在移动设备上看起来还不错，但在我的桌面上它会搞砸。

知道如何解决这个问题吗？实际上，我让 owl carousel 2 像我想要的那样工作，但由于某种原因，当我滑动时，我得到一个白色背景，它必须加载图像，我认为它被称为平滑滚动，如果我错了，请纠正我。也许我出于我的意图使用了错误的轮播？

提前致谢。

【问题讨论】：

你需要使用媒体查询来调整div类卡片的宽度
嗨，幸运的 Chingi，感谢您的回复！你能再给我一个提示吗？如果我将卡片类的高度增加到例如335px 看起来不错，我的卡片动作消失了，然后我必须将 bx-viewport 高度增加到 516px。我怀疑这是正确的做法，但也许确实如此。
我建议增加“卡片”类的宽度以匹配移动设备屏幕的最小宽度，这样就只能看到一张图像。或者在手机屏幕上使用 jQuery 将 MaxSlides 切换为 1
所以在我的卡片类中你会添加类似 min-width:100%; ?
我改回了 owl carousel 2.. 也许有人可以告诉我为什么每个幻灯片元素都必须加载，正如我在第一篇文章中所写的那样：“我实际上让 owl carousel 2 工作起来就像我想要它，但由于某种原因，当我滑动时，我得到一个白色背景，它必须加载图像，我认为这被称为平滑滚动，如果我错了，请纠正我。”

标签： jquery css carousel bxslider

【解决方案1】：

我没有看到您页面中的任何错误

无论如何，我看到您为每张幻灯片定义了一个宽度，这是导致问题的原因。请删除幻灯片宽度。你可以阅读更多here

【讨论】：