javascript - Lush Slider 全宽和限制高度

Question

我相信我已经尝试了所有的事情，但都惨遭失败。我一直在使用响应式 slider ，但遇到了一些重大问题。

开始时，我从演示中提取了准确的代码并将其放在我的页眉中，但它的底部和右侧有一个奇怪的填充，所以我删除了它并认为除了高度之外它工作正常。它太大了，占据了页面的一半以上。

当我调整窗口大小并重新加载页面时， slider 的背景位于左上角，比需要的要小得多。那么只有在 100% 屏幕重新加载时响应能力才有效？那不会产生任何场景。

此外，高度也让我很困扰。我根本无法调整它的大小，当我将静态高度放在 10em 的 ul 和 li 上时，它确实调整了大小，但随后响应速度就消失了。

我试图在 js fiddle 中发布它，但是插件的代码太多以至于它在没有运行任何东西的情况下崩溃了。如果有帮助，我可以在上面发布一个开发站点。正如我所说，我使用了演示文件中的 html 和 css，我只是去掉了一些填充以使其全宽。

如有任何帮助，我们将不胜感激。

Answer 1

好的，我已经设法解决了宽度问题。问题似乎与初始 baseWidth 有关，默认为 1140 像素。玩弄

data-base-width="600" and data-base-height="600" 

第一个 lush slider div 标签中的属性可能会看到你取得了一些进步，但看起来只接受固定值，不接受百分比。我选择了这个似乎有效的解决方案，使用 document.write 方法编写第一个 div 标签，并以编程方式设置 clientWidth 的宽度，如下所示:

<script>
document.write('<div id="lushDiv" class="lush-slider autoload shadow-a" data-slider-pause-on-hover="true" data-base-width="' + document.body.clientWidth + '" data-base-height="600" style="background: rgb(229, 229, 229)">');
</script>