简体繁体 English

如何制作一个真正的响应式图像滑块？

[英]How to make a REAL responsive image slider?

原文 2017-05-02 13:25:40 6 1 javascript/ html/ css/ responsive-design/ opencart

Here I have 'responsive image slider'on my site but as you can see, these images are not really feet well, sometimes it's bigger as in expected to be, sometimes cutted. 在这里，我的网站上有“响应式图像滑块”，但是正如您所看到的，这些图像的脚并不是真的很好，有时它比预期的要大，有时会被切掉。
How can I fix this problem do I need special picture sizes for this like 4240x2600 ? 如何解决此问题，我是否需要特殊的图片尺寸（例如4240x2600）？

At diffrent screen resolutions it looks diffrent and odd 在不同的屏幕分辨率下，看起来不同而奇怪

site - hicandy.ru (sorry can't add more than 2 links) 网站-hicandy.ru（抱歉，不能添加两个以上的链接）
it was built on OpenCart and slider uses 'Revolution Slider' 它建立在OpenCart上，并且滑块使用“ Revolution Slider”

expamples expamples
example 1 例子1
example 2 例子2

1 个解决方案

I think you have different options: 我认为您有不同的选择：

CSS media queries for display a different layout for your image slider which will be applied based on your browser size window. CSS媒体查询用于显示图像滑块的不同布局，该布局将根据浏览器大小窗口应用。
Percentage base layout, example ( width: 20%; ). 基本布局百分比，示例（ width: 20%; ）。
A combination of both plus JavaScript for example http://bxslider.com 两者加JavaScript的组合，例如http://bxslider.com