问题标签 [skrollr]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
2 回答
2213 浏览

jquery - skrollr relative 无法正常工作

您好,我试图理解 sckrollr,但我似乎在相对使用方面失败了,我试图得到的是:

  • 有 X 个盒子,里面有一些元素
  • 当元素锚点到达视口锚点时

我不明白我有上面的代码,skrollr 做第二个 .text 元素的动画,因为 soo ai 开始滚动页面,他不应该只在元素锚点到达视口锚点时才制作动画吗?

我只是不明白

0 投票
6 回答
18306 浏览

jquery - 为移动设备禁用 Skrollr (<767px)

首先要感谢@prinzhorn 提供了如此惊人而强大的库。我的问题:我已经在我的网站标题中实现了 Skrollr 视差背景,但我想在移动设备上查看时禁用此功能,特别是 iphone 等,例如。(最大宽度:767px)。我想知道最好的方法是什么?如果 destroy() 函数能够做到这一点,或者我应该使用另一种技术?另外,如果 destroy() 是答案,我该如何正确实现呢?非常感谢和示例或演示非常感谢。

0 投票
0 回答
641 浏览

jquery - Skrollr:定义三个动画关键帧

我在使用 Skrollr 时遇到问题:我想为一个元素定义三个状态。例如:

在我看来,只能定义开始和结束,这使我无法反转动画,对吗?

非常感谢!

0 投票
1 回答
2753 浏览

html - 超出视口时如何停止播放html5视频?

我在使用 skrollr 时遇到了这个问题:一切正常,然后在添加视频时,如果超出视口,它会继续播放,即使 div 有 display:none 声明。我尝试在这里和谷歌搜索,但找不到任何东西,此时我真的迷路了。

作为参考,这是我正在使用的代码:

任何有关如何实现这一目标的帮助都非常感谢

0 投票
1 回答
19870 浏览

javascript - Skrollr init 设置高度太高

我使用 Skrollr 库为背景创建视差效果。但是,当调用 Skillor.init() 时,body 高度太高,并在页面下方创建了额外的空间。

问题可以在这里看到: http: //codepen.io/designil/pen/Ggxde

HTML:

CSS:

JS:

我不确定哪个元素使页面太高。

0 投票
0 回答
69 浏览

javascript - Skrollr 不会在正确的位置为最后一个 div 设置动画

我正在使用 Skrollr 在我正在制作的网站上制作一些不错的视差效果。前两个 div 工作正常,但底部 Skrollr 工作不正常。

我可以看到当我在网站顶部时它会产生一些东西,所以当我向下滚动时,div 已经在底部。

任何人都可以看看,看看我在这里错过了什么?我可能很快就会开始拉我的头发:)

链接是http://crap.futuredev.se/gd/

先感谢您!

0 投票
1 回答
1921 浏览

javascript - 在特定的可滚动 div 上应用 skrollr

在某个项目上;html 和 body 滚动被100%阻止overflow:hiddenmax-width/height没有滚动那些。

可滚动的是特定的 div;在其上应用overflow-y:scrolland -webkit-overflow-scrolling: touch(这个可滚动的 div 被归类.frames为 ,暂时让我们说只有一个)

我想使用 skrollr;因此有插件来检测这个.framesdiv 的滚动。

问题是,它不起作用。然后我将 #skrollr-body 添加到 div .frames

结果: skrollr 在移动设备上启用并按预期工作。(不是那么顺利,但有效)。

但是,在桌面上,没有效果。如果我使用以下命令登录桌面:

('s' 是skrollr.init动作的名称),输出保持为 0。

所以最后似乎 skrollr 只适用于桌面上的 body。有什么事情要做吗?非常感谢任何线索

0 投票
2 回答
2380 浏览

jquery - 如何在向上滚动时停止 skrollr

自过去 3 天以来,我一直在为 skrollr 问题烦恼,有些白痴认为这是一种营销噱头,当我滚动到底部时,我想停止 skrollr 插件。向上滚动时它不应该做任何事情。我的意思是它不应该反转动画

这是我的小提琴

http://jsfiddle.net/eq3u9/1/

只是知道我已经将航点 js 也集成到了这个项目中

0 投票
3 回答
14905 浏览

ipad - 为什么 skrollr 阻止在 ipad 上滚动?

我正在尝试使用skrollr创建一个简单的视差动画:我的网站在 Chrome/Mac 上运行良好,但我在 ipad 上看到了异常行为。

在 ipad 上(在 IOS 模拟器上测试),

  • 页面的主体根本不滚动(或者可能在背景中滚动,在动画 div 下方?)
  • data-start动画背景位置(折纸图案)在/中定义的范围内沿相反方向(向下是向上)滚动data-top-bottom

在桌面上,如果我破解chrome 开发工具div#hero,我可以模拟效果。position: fixed;

  • skrollr示例在 IOS 模拟器中按预期工作。
  • <div id="skrollr-body"></div>在结束</body>标签之前

有什么建议么?

0 投票
2 回答
2556 浏览

javascript - jQuery 在移动设备上使用 skrollr 自动滚动?

我使用skrollr为 iOS 制作了一个视差网站。我想以编程方式向下滚动到页面上的某个点。我使用过 jquery 滚动插件,它们可以在桌面上工作,但不能在移动设备上工作。如何使用 jQuery 模拟滑动或以某种方式模拟滚动到另一个点?谢谢!

编辑:这不起作用的原因是在移动设备上,由于 iOS 在滚动期间停止动画,skrollr 实际上并没有滚动。相反,它会监听触摸事件并移动元素。这就是为什么 scrollTo 插件不起作用的原因。(来源:https ://github.com/Prinzhorn/skrollr#mobile-support )