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

Question

我对 IE11 (Jssor 18.0) 中滑块容器的相对尺寸有疑问。

HTML结构：

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

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

无法缩放 jssor 滑块，'outer container' 的 'dimension' 无效。请以像素为单位指定 'dimension'。例如'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 要求 width/height 以像素为单位指定。有关详细信息，请参阅文档 - 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 中的错误

Jssor Slider - Relative dimensions cause error in IE11

html

css

jssor