如何使用没有固定高度和宽度的 JSSOR 滑块答案

【问题标题】：How to use JSSOR slider without fixed height and width如何使用没有固定高度和宽度的 JSSOR 滑块
【发布时间】：2015-03-04 18:43:22
【问题描述】：

我正在使用 jssor 滑块作为图像滑块。

我希望我的图像占据整个屏幕的宽度但高度的一半。我正在使用以下代码将图像调整为不同的屏幕尺寸

function ScaleSlider() {      
    var parentWidth = $('#slider1_container').parent().width();     


      if (parentWidth) {
       jssor_slider1.$ScaleWidth(parentWidth);

   }
   else
       window.setTimeout(ScaleSlider, 30);
}

我的理解是要让 JSSOR 滑块工作，我需要提供宽度和高度。我有尺寸为 1280 X 415 的图像。我为内部和外部 slier 容器提供了 1280 的宽度和 200 的高度

    <div id="slider1_container" style="position: relative; top: 0px; left: 0px; width: 1280px; height: 200px; overflow: hidden;">
    <!-- Slides Container -->
    <div u="slides" style="cursor: move; position: absolute; overflow: hidden; left: 0px; top: 0px; width: 1280px; height: 200px;">
        <div>
            <img u="image" src="~/Images/slider/Slider_2.jpg" />                

        </div>
        <div>

            <img u="image" src="~/Images/slider/high-ct.jpg" />
        </div>

现在的问题是在更宽的屏幕上图像看起来拉伸（很多）？有什么方法可以在 JSSOR 中使用百分比/或任何其他解决方案的宽度和高度来避免拉伸？

【问题讨论】：

标签： jquery html css jssor

【解决方案1】：

您可以通过 CSS 更改高度和宽度。我在 www.bmskpt.in 的画廊中放了一个滑块

【讨论】：

你在使用 JSSOR 吗？还是滑块？

【解决方案2】：

解决方案 1：

请尝试 $FillMode 值 1 或 2 或 4

解决方案 2：

指定'宽度：1280px;高度：415px；'用于“外部容器”和“幻灯片”容器。

为滑块的父节点指定“溢出：隐藏”和大小（您需要的）。

【讨论】：

jssor 感谢您的回复。
jssor 感谢您的回复。我在此处发布之前尝试了 $FillMode 选项 1 和 2，但没有帮助。但是，现在我在看到您的回复后再次尝试，并且神奇地它正在工作（虽然不是完全出水）。它没有拉伸，但它是顶部和底部的切割。我看不到整个图片。我尝试了填充模式的选项 4，但没有奏效。
我不明白您的解决方案 2 的第二行：
为滑块的父节点指定“溢出：隐藏”和大小（您需要的）。。我从开始就有“溢出：隐藏”，我是不确定您对尺寸的评论