OStack程序员社区-中国程序员成长平台

标题: jquery - 旋转设备方向时，JSSOR slider 在 iOS 中无法正确调整大小 [打印本页]

---

作者: 菜鸟教程小白    时间: 2022-12-12 22:15
标题: jquery - 旋转设备方向时，JSSOR slider 在 iOS 中无法正确调整大小

我正在设计一个响应式网站并使用 jssor slider 。 slider react 灵敏，可以很好地与头部中的以下内容配合使用:

<meta name="viewport" content="width=device-width>

当我编辑此片段时，如下所示，当将设备从横向旋转到纵向(反之亦然)时， slider 在 iOS 中无法正确调整大小:

<meta name="viewport" content="width=device-width, initial-scale=1">

我正在尝试阻止 iOS 在横向模式下放大。

您可以在打开 this page 时看到此问题的示例在 iOS 设备或模拟器上来回更改设备方向。 slider 在横向和纵向中都可以正确打开/加载。问题仅出现在设备旋转时。

这是控制调整大小/响应能力的脚本部分:

$JssorSlider$("slider2_container", options);
        function ScaleSlider() {
            var parentWidth = jssor_slider2.$Elmt.parentNode.clientWidth;
            if (parentWidth)
                jssor_slider2.$ScaleWidth(Math.min(parentWidth, 1024));
            else
                window.setTimeout(ScaleSlider, 30);
        }

        ScaleSlider();
        $(window).bind("load", ScaleSlider);
        $(window).bind("resize", ScaleSlider);
        $(window).bind("orientationchange", ScaleSlider);
    });

---

Best Answer-推荐答案

请处理方向改变事件

    function ScaleSlider() {
        var parentWidth = jssor_slider2.$Elmt.parentNode.clientWidth;
        if (parentWidth)
            jssor_slider2.$ScaleWidth(Math.min(parentWidth, 1024));
        else
            window.setTimeout(ScaleSlider, 30);
    }

    ScaleSlider();
    $(window).bind("load", ScaleSlider);
    $(window).bind("resize", ScaleSlider);
    $(window).bind("orientationchange", ScaleSlider);

关于jquery - 旋转设备方向时，JSSOR slider 在 iOS 中无法正确调整大小，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/23547815/

---

欢迎光临 OStack程序员社区-中国程序员成长平台 (https://ostack.cn/)

Powered by Discuz! X3.4