Question

我在IE11（Jssor 18.0）中滑块容器的相对尺寸有问题。

HTML结构：

有一个具有绝对尺寸的外部div（宽度和高度，以像素为单位）。
有内部div，创建滑块的内部div，相对尺寸（宽度=高度= 100％）。

滑块在Firefox 38和Chrome 43中运行良好。在IE11中出现以下错误（好吧 - 任何IE，我试过IE9，IE10和IE11）：

无法缩放jssor滑块，“外部容器”的“尺寸”无效。请以像素为单位指定“尺寸”。例如'dimension: 600px;'

对于绝对尺寸，滑块在所有浏览器中均可正常工作。

问题是，我可以在IE11中使用滑块容器的相对尺寸吗？

CSS和HTML：

    .npw-banner {
        width: 720px;
        height: 480px;
    }
    .npw-banner .npw-slider-container {
        width: 100%;
        height: 100%;
    }

    <!-- outer div with absolute dimensions -->
    <div class="npw-banner">
        <!-- slider div with relative dimensions -->
        <div id="banner_slider_container" class="npw-slider-container">
            <div class="npw-slides" u="slides">...</div>
            <div u="navigator" class="npw-navigator">...</div>
        </div>
    </div>

这是fiddle。

Answer 1

Jssor Slider需要以像素为单位指定宽度/高度。有关详细信息，请参阅文档 - http://www.jssor.com/development/reference-ui-definition.html。

如果存在约束并且无法以像素为单位指定尺寸，则可以使用jQuery计算绝对值。

示例：

var $container = $("#" + containerId);

var containerWidth = $container.width();
var containerHeight = $container.height();

$container.width(containerWidth);
$container.height(containerHeight);

Jssor Slider - 相对尺寸在IE11中导致错误

1 个答案: