【问题标题】:jQuery Jssor Image Slider Width IssuejQuery Jssor 图像滑块宽度问题
【发布时间】:2015-05-04 23:21:10
【问题描述】:

我最近实现了响应式的 Jssor Image Slider:

http://www.petcenters.com/Interior-Painting-Gallery

这里是演示: http://www.jssor.com/demos/image-gallery.html

我在调整此容器的宽度时遇到问题。

我尝试在几个地方将宽度属性更改为 1340px:

<div id="slider1_container" style="position: relative; top: 0px; left: 0px; width: 800px; height: 456px; background: #191919; overflow: hidden;">

<div u="slides" style="cursor: move; position: absolute; left: 0px; top: 0px; width: 800px; height: 356px; overflow: hidden;">

我也尝试过在响应式 JavaScript 中进行修改。这导致 ExtraSmall ViewPort 出现问题:

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

我还发现有些动画偏离了中心。

这可能是一个非常简单的问题,但不幸的是我没有足够的 CSS 经验。

任何帮助将不胜感激。

【问题讨论】:

  • 其实我试过email,他一定很忙。
  • @humble.rumble.6x3 你可能是对的,javascript 正在处理多个地方的宽度。
  • @humble.rumble.6x3 绝对我很想发布答案。也许其他人也会有答案。
  • @humble.rumble.6x3 这不是很明显,你看到哪里引用了宽度吗?我只能找到 Outer Container 和 Slides Container。
  • @humble.rumble.6x3 导致幻灯片图像消失,容器变为黑色。

标签: javascript jquery css jssor


【解决方案1】:

请更换

jssor_slider1.$ScaleWidth(Math.max(Math.min(parentWidth, 800), 300));

jssor_slider1.$ScaleWidth(Math.max(Math.min(parentWidth, 1340), 300));

它将滑块宽度缩放到最大 1340 像素和最小 300 像素。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2014-02-27
    • 2012-01-12
    • 1970-01-01
    • 1970-01-01
    • 2014-11-01
    • 1970-01-01
    • 1970-01-01
    • 2016-10-14
    相关资源
    最近更新 更多