Ken Burns 效果与 nivo 滑块

2024-02-28

有没有人设置一个尼沃滑块 http://nivo.dev7studios.com/平移每个图像(又名肯伯恩斯效应 http://en.wikipedia.org/wiki/Ken_Burns_effect)?我正在尝试实现它,但有点棘手!


事实上,我的实施工作已经开始工作了!

我有一个平移功能循环..像这样:

function ken_burns_loop(el) {
  $(el)
    .animate({
      'background-position-x': '40%',
      'background-position-y': '60%'
    }, 8000, 'linear')
    .animate({
      'background-position-x': '30%',
      'background-position-y': '40%'
    }, 8000, 'linear')
    .animate({
      'background-position-x': '70%',
      'background-position-y': '70%'
    }, 8000, 'linear', function() { ken_burns_loop(el); });
}

我正在初始化 nivo 滑块,如下所示:

$('#welcome-slider').nivoSlider({
  effect: 'fade',
  slices: 1,
  directionNav: false,
  afterChange: function() {
    $('#welcome-slider, .nivo-slice').stop(true);
    ken_burns_loop('#welcome-slider, .nivo-slice');
  }
});
ken_burns_loop('#welcome-slider, .nivo-slice');

我仍在解决定位方面的一些问题。

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

Ken Burns 效果与 nivo 滑块 的相关文章

  • 显示来自 mongodb 的所有数据并在 doT.js 模板引擎中渲染它

    我想从 mongodb 中提取数据并将其传递给视图 一切似乎都正常 但我没有看到所有 10000 条记录都显示出来 而是只看到了一条 我觉得我非常接近解决它 但我陷入困境 我正在使用node mongodb native express和d
  • 如何将js文件从同一文件夹导入chrome扩展中的background.js

    我在导入与 background js 脚本库 位于同一库中的文件 score js 时遇到问题 我对 js 和 chrome 扩展都很陌生 我研究了 require js 并做了这个 背景 html h1 Tab Manager h1
  • 如何制作复选按钮? (带有标签的隐藏复选框作为按钮:仅限 CSS)

    Using 方法1 创建可点击标签 https stackoverflow com a 6293626 1326147 用 CSS 隐藏复选框 https stackoverflow com a 18078908 1326147 and 使
  • 如何将这段 javascript 代码重写为 C++11?

    这是我在 Javascript Definitive Guide 中看到的 javascript 闭包代码 我想把它写成C 11 var uniqueID1 function var id 0 return function return
  • 如何在给定目标索引数组的情况下对数组进行就地排序?

    你如何对给定的数组进行排序arr in place给定目标索引数组ind 例如 var arr A B C D E F var ind 4 0 5 2 1 3 rearrange arr ind console log arr gt B E
  • jQuery 提交未触发

    我觉得问这个很愚蠢 但为什么我的 submit 没有发出警报 HTML div class buttonbar style margin left 10 div
  • 如何禁用向左滚动?

    I got a div 元素 parent 包含多个子元素 item 我想启用滚动父元素一个方向 left OR正确的 否则什么都不会发生 看我的代码 parent scroll function gt gt gt scroll event
  • 选择 jQuery 中的每第 n 个项目?

    jQuery 有方便的 even 和 odd 选择器 用于选择集合中偶数或奇数索引的项目 我用它来清除一系列浮动框中的所有其他项目 如下所示 div class 2up div div div div div div div and Cle
  • 在浏览器中打开的 .mhtml 文件中填写输入

    我想对 mhtml 文件运行 e2e 测试 即填写表格 在 mhtml 文件上查看和提取数据效果非常好 但我无法填写任何内容input字段 既不是手动也不是通过木偶操作者 你可以用这个试试 mhtml 文件 https gist githu
  • jquery 中 DOM 元素的手动垃圾回收是否可以提高浏览器性能?

    在性能范围内 删除不再需要的元素是否有意义 或者浏览器是否对代码中未进一步引用的 dom 元素执行自动垃圾收集 some element fadeOut 1000 function el el remove lt does this mak
  • jQuery异步ajax查询和返回值问题(范围、闭包)

    由于异步查询和变量范围问题 代码无法正常工作 我不明白如何解决这个问题 使用 async false 更改为 ajax 方法 不是一个选项 我知道闭包 但我如何在这里实现它 不知道 我已经在这里看到了有关 js 中的闭包和 jQuery 异
  • NodeJS 错误堆栈未定义 [关闭]

    Closed 这个问题需要细节或清晰度 help closed questions 目前不接受答案 我正在使用节点检查器 我注意到new Error 有未定义的堆栈 如果我将此值分配给一个变量 该变量将显示堆栈未定义 有趣的是 跑步new
  • 用空字符串替换状态:Javascript

    我有这个网址 website com con blog true 我在 javascript 中所做的是 if getURLparams blog RandomFunction change the url window history r
  • 图像未显示在从 HTML 创建的 PDF 上

    我想动态创建 PDF 这意味着我将从 Google Drive 获取文件 然后将它们放入 HTML 代码中 并尝试从中创建 PDF 一切工作正常 除了图像没有显示 我现在正在做的是 从 HTML 字符串创建 HtmlOutput 获取该 H
  • 选择 jQuery 数据网格插件? [关闭]

    就目前情况而言 这个问题不太适合我们的问答形式 我们希望答案得到事实 参考资料或专业知识的支持 但这个问题可能会引发辩论 争论 民意调查或扩展讨论 如果您觉得这个问题可以改进并可能重新开放 访问帮助中心 help reopen questi
  • 如何始终将焦点保持在画布上?

    我一直在这个论坛寻找解决方案 但尚未找到 无论我在页面上的哪个位置单击 我都需要始终将焦点放在画布元素上 我有几个按钮 在每个 onclick 事件中我写 document getElementById canvas focus 这确实有效
  • 使用 JQueryUI Autocomplete 和 Meteor 的规范方法

    使用 Meteor 我想了解使用 JQuery UI 自动完成处理大量服务器端数据的最有效方法 我有两个工作提案 想听听关于差异的意见 以及是否有更好的方法来做同样的事情 使用发布 订阅 Server Meteor publish auto
  • ReactJS setState 仅在嵌套在 setState 中时才有效

    问题 当我使用 this setState 并在回调中输出状态时 它根本不会改变 但是当我将 setstate 嵌套在 setstate 中时 它将正常工作 例子 这不行 this setState data newData 这确实有效 t
  • 猫头鹰轮播,制作自定义导航

    所以我有一个包含三张图像的猫头鹰旋转木马 我还在左侧和右侧添加了自定义导航箭头 png 图像 然而 这些箭头目前是无用的 因为我找不到一种方法来真正让它们在我的猫头鹰旋转木马的图像之间切换 我无休止地寻找 找不到解决方案 有任何想法吗 您需
  • Javascript 最佳实践,为什么使用逗号来链接函数/变量声明?

    我一直在为 jQuery jQueryLog 开发一个插件 以允许调试链选择器和返回值 如果你想检查一下 你可以这样做here http www jquerylog com 这已经是第二个版本了 第一个版本实际上是经过编辑的 jQuery

随机推荐

  • 溢出-x:可见;溢出-y:自动;不起作用 - 这个标准符合吗? [复制]

    这个问题在这里已经有答案了 我在开发网页时遇到问题 Firefox 或 Internet Explorer 都不会呈现我期望的以下代码片段的行为 div style width 200px height 200px border 1px s
  • 是否可以让空的 RequestParam 值使用 defaultValue?

    如果我有一个类似于以下内容的请求映射 RequestMapping value test method RequestMethod POST ResponseBody public void test RequestParam value
  • Java 中的无符号短整型

    我怎样才能声明unsigned shortJava 中的值 你不能 真的 Java 没有任何无符号数据类型 除了char 诚然你could use char 这是一个 16 位无符号类型 但在我看来这将是可怕的 因为char显然适用于文本
  • Python QuTiP 中的集成未成功

    我一直在尝试使用 QuTiP 来求解量子力学矩阵微分方程 Lindblad 方程 这是代码 from qutip import from matplotlib import import numpy as np hamiltonian np
  • 用其他语言编写 JavaScript

    我有一些不会说英语的客户 他们希望我用另一种语言为他们编写 JavaScript 浏览器可以理解其他语言吗 还是我仅限于非英语注释 navigateur nomApp indice Microsoft 代替 navigator appNam
  • 当没有按钮时,如何防止 fetch 请求重新加载 Javascript 页面?

    首先我要说的是 有无数的线程描述了涉及按钮的问题 通常 只需对传入的事件调用 event preventDefault 即可解决该问题 但是 如果在发生超出用户控制范围的事件 例如 经过一定量的帧后 后调用 post 请求 该怎么办 mak
  • 在 pandas/matplotlib 中获取散点图的 Colorbar 实例

    如何获取 pandas DataFrame plot 创建的绘图的内部创建的颜色条实例 以下是生成彩色散点图的示例 import matplotlib pyplot as plt import pandas as pd import num
  • 尺寸改变时宽度不改变

    我已经这样做很多年了 但现在它不起作用了 private void Form1 Deactivate object sender EventArgs e this Size new Size 30 29 txt Visible false
  • 有基础活动课程好吗?

    拥有好不好BaseActivity类 它将作为所有其他活动的超级类 我需要这个来为活动提供一些通用的实现 基础活动 public class BaseActivity extends Activity All Common implemen
  • 在 C# 中移动 Form2 时移动 Form1

    我有两种形式 Form2正在被打开Form1 像这样 Form2 ShowDialog StartPosition of Form2配置为centerParent 我需要固定位置Form2在 Form1 的中心 这样当我移动时Form2 F
  • 如何为 SSL 握手配置 CFStream(或 NSStream)?

    我正在使用 CFStream NSStream 建立 http 连接 我希望能够检测到 SSL 握手在三种情况下失败 情况A 服务器不可信 情况 B 服务器受信任 但要求提供客户端证书 情况 C 服务器不受信任 它要求客户端证书 今天 我没
  • Yeoman 无法识别全球安装的发电机

    I ran sudo npm install g generator flask它被保存了 我能够通过运行来确认npm list g 然后我跑yo flask 我以为这会起作用 但收到一条错误消息 Error flask You don t
  • Oracle在Java中的RETURNING INTO用法(JDBC、Prepared Statement)

    我正在使用 JDBC 执行 Oracle 语句 如下所示 INSERT INTO MYTABLE MYDATA VALUES RETURNING MY CALCULATED DATA INTO MYTABLE s def makes MY
  • Intellij 完成贡献者

    我正在为 intellij 开发一个插件 我想向基于 xsd 的 xml 编辑器添加自定义建议 到目前为止 我可以从 xsd 文件中获取所需的建议 我已经实现了 xml 的完成贡献者 如下所示 import com intellij cod
  • 将两个元素对齐在同一行

    我正在尝试对齐两个不同的 p 同一行上的元素 我让它工作了 但它完全弄乱了我的标志 他们俩 p p 元素是您在徽标两侧看到的 TEST 对齐的代码是这样的 HTML代码 p div class container div align cen
  • php 解析错误不会显示

    我正在运行 ubuntu 10 04 nginx php fpm 5 4 如果我设置display errors On在 php ini 中 所有错误都会被打印 如果相反 我将其设置为关闭 然后使用 ini set display erro
  • ggplotly 上的主标题和 legend.position 问题

    我在如何在 ggplotly 中定位主标题和图例时遇到问题 我希望我的主标题位于图表顶部并左对齐 我还希望我的图例位于图表的底部中心 这是我的代码 library ggplot2 library dplyr library tidyr li
  • 如何更改bookdown中的图形标题格式

    使用 bookdown 单个文档 时 图会自动编号为 图 1 图标题文本 在化学中 惯例是将主要数字标记为 图1 图标题的文本 对于支持信息文件 图S1 图标题的文本 另外 在文本中的图形参考中 我们需要 如图 1 所示 所以参考文本不应该
  • Windows8 中的首选字体大小需要计算器吗?

    在查看一些官方 Windows8 Metro 材料时 我看到了这行 xaml
  • Ken Burns 效果与 nivo 滑块

    有没有人设置一个尼沃滑块 http nivo dev7studios com 平移每个图像 又名肯伯恩斯效应 http en wikipedia org wiki Ken Burns effect 我正在尝试实现它 但有点棘手 事实上 我的