Jssor Slider:响应式代码

2023-12-01

我正在使用 Jssor 滑块(http://www.jssor.com/demos/slider-cluster.html)。由于我的幻灯片很大(宽度约为 2000 像素),因此它们在较小的设备(甚至 iPad)上会显着缩放。我不介意在较小的设备上对称地裁剪两侧(左侧和右侧)。

然而,发生的情况是滑块固定在左侧 0 像素处。 1)我是否可以集中整个幻灯片容器? 2)并根据窗口/浏览器的高度缩放幻灯片容器?

我确实参考了这个,但没有激发任何解决方案:Jssor 滑块 100% 宽度

有人可以帮忙吗?谢谢。


响应式代码以适应高度或宽度

//responsive code begin
//you can remove responsive code if you don't want the slider scales while window resizes
function ScaleSlider() {
    var windowWidth = $(window).width();

    if (windowWidth) {
        var windowHeight = $(window).height();
        var originalWidth = jssor_slider1.$OriginalWidth();
        var originalHeight = jssor_slider1.$OriginalHeight();

        var scaleWidth = windowWidth;
        if (originalWidth / windowWidth > originalHeight / windowHeight) {
            scaleWidth = Math.ceil(windowHeight / originalHeight * originalWidth);
        }

        jssor_slider1.$ScaleWidth(scaleWidth);
    }
    else
        window.setTimeout(ScaleSlider, 30);
}

ScaleSlider();

$(window).bind("load", ScaleSlider);
$(window).bind("resize", ScaleSlider);
$(window).bind("orientationchange", ScaleSlider);
//responsive code end
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Jssor Slider:响应式代码 的相关文章

随机推荐

  • 如何使用Python计算目录中的文件数量

    我如何只计算files在目录中 这将目录本身算作一个文件 len glob glob os listdir 会比使用稍微更有效glob glob 要测试文件名是否是普通文件 而不是目录或其他实体 请使用os path isfile impo
  • 在单独的页面中打印 Javascript? [关闭]

    Closed 此问题正在寻求书籍 工具 软件库等的推荐 不满足堆栈溢出指南 目前不接受答案 我目前正在使用 PHP 并获取完整的用户详细信息并将其显示到 html 表中 我遇到的问题是 当我打印 3 个表格时 每个表格都完美地打印在每页上
  • 为什么在更改 main 的签名时会出现段错误?

    我试图涉足 C 语言 并编写了这个程序 在随机位置显示我的 RAM 的 kb 这是代码 并且运行良好 include
  • 哪个 DLL 具有 Windows.Devices.Gelocation 命名空间?

    我正在使用 VS 2012 我需要编写使用 Windows Devices Gelocation 命名空间中的类的代码 我下载了示例程序 但它无法在 VS2012 中加载 因为它需要 VS 2013 并且该类的文档没有指示该命名空间位于哪个
  • Android 有准确的重复闹钟系统吗?

    背景 I m currently developing an application for Android which revolves around an alarm that goes of on an user specified
  • 静脉中的行人模拟 (omnet++/sumo)

    我正在尝试在 omnet 中运行相扑行人模拟 为了保持简单 我是初学者 我决定使用Erlangen示例提供了静脉并用几个行人扩展它 我添加了相扑中的行人并运行它 它工作得很好 你可以看到这张照片中的行人和汽车 接下来我尝试在 omnet 中
  • opencv 将图像与文本二值化

    我需要用文本对图像进行二值化 它工作得很好 但在某些情况下输出是空的 白色图像 code Compile g txtbin cpp o txtbin pkg config opencv cflags libs Run txtbin inpu
  • 如何检查PCF版本

    有没有办法知道哪个Pivotal Cloud Foundry我们正在使用的许可版本 我看到公共 PCF 中免费提供一些市场服务 但在我们使用的许可 PCF 版本中不提供这些服务 我假设版本不匹配可能是原因 作为一个正常人cf对于 Pivot
  • HighCharts:水平条形图的对数刻度

    我正在与高图表生成条形图 我的值范围可以从最小 0 到最大 100k 示例 因此 图表中的一个条可能非常小 而另一个则可能非常长 HighCharts 引入了 对数缩放 功能 可以看到其中的例子HERE 我的js代码是这样写的jsfiddl
  • Woocommerce:如何从 id 获取产品 slug?

    目前 我的购物车中有可用的产品 ID 我需要检索该商品 我怎样才能做到这一点 您可以使用get post product get post 27 slug product gt post name echo slug
  • .htaccess 中的条件 DirectoryIndex

    是否可以将 DirectoryIndex 值设置为 htaccess基于 IP 的条件文件 因此 例如 我的 IP 会看到DirectoryIndex正如index html 和其他人看到的DirectoryIndex作为index php
  • 具有多个手柄和内容背景颜色的滑块

    我正在尝试使用 Jquery UI 滑块 其中我可以有多个句柄 function var handlers 25 50 75 slider slider min 0 max 100 values handlers slide functio
  • 带空括号的默认构造函数

    是否有任何充分的理由表明一组空的圆括号 圆括号 对于调用 C 中的默认构造函数无效 MyObject object ok default ctor MyObject object blah ok MyObject object error
  • 使用 Actionscript 更改字符串中的字符

    的相反词是什么String charAt 如果我有一个字符串 var Str String Hello World 如何更改第五个字符 例如从 更改为 我可以像这样获取第五个字符 var C String Str charAt 5 但如何设
  • xCode:未找到库 - lPods-Bolts - 退出代码 1

    您好 我遇到这个问题 ld 找不到 lPods Bolts 的库 clang 错误 链接器命令失败 退出代码为 1 使用 v 查看 调用 不过 我从 Facebook 文档下载了 Bolt 包并将其放入我的支持文件中 另外 我使用的是Coc
  • 新 C# 8.0 开关表达式的运算符优先级是什么?

    我刚刚将当前项目升级到新发布的 NET Standard 2 1 和 C 8 0 并决定转换一些大型项目switch语句变成新的 更加紧凑的表达式语法 由于返回的值进一步用于某些计算 我想知道新的值如何switch当输入变量位于运算符旁边时
  • 将文件批量上传到特定联系人 Salesforce

    我需要向 salesforce 中的特定用户上传大约 2000 个文档 我有一个 csv 文件 其中包含 Salesforce 分配的 ContactID 以及桌面上文件的直接路径 每个联系人的特定文件 URL 已包含在 csv 中 我怎样
  • 需要突出显示 jquery datepicker 中的日期范围[重复]

    这个问题在这里已经有答案了 我正在使用 jQuery UI 显示内联日期选择器 其中我有一个开始日期和一个结束日期 我想强调一下它们之间的日期 您可以使用 jQuery UI 日期选择器演出日之前函数并在其中检查是否必须根据您的范围突出显示
  • 在Python中读取字段中包含逗号的CSV文件

    我需要读取一个 CSV 文件 其中包含带有逗号的字段 因此我对包含逗号的字段进行了双引号 例如 1 text1 text2 text3 text4 a b c 但是当我尝试在 Python 中读取文件时 我得到用逗号分隔的字段 如下所示 r
  • Jssor Slider:响应式代码

    我正在使用 Jssor 滑块 http www jssor com demos slider cluster html 由于我的幻灯片很大 宽度约为 2000 像素 因此它们在较小的设备 甚至 iPad 上会显着缩放 我不介意在较小的设备上