jquery - 如何使用没有固定高度和宽度的 JSSOR slider

Question

我正在为图像 slider 使用 jssor slider 。

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

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


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

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

我的理解是要让 JSSOR slider 工作，我需要提供宽度和高度。我有尺寸为 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>

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

Answer 1

您可以通过 CSS 更改高度和宽度。我在 www.bmskpt.in 的图库中放了一个 slider