问题标签 [parallax]

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 投票
1 回答
2019 浏览

javascript - 视差,作为主页横幅

这是一个非常模糊的问题,但我不知道从哪里开始,所以如果有人能给我一些想法,那你很棒。

我想在我的网站主页上制作视差效果,但我不确定如何创建这种效果。我想要的效果在这里http://davegamache.com/chase-happiness/和这里http://themetrust.com/demos/hero/。它们都使用类似于向下滚动图像和文本以不同速度移动并淡出的原理。

所以基本上我的问题是,有谁知道我应该从哪里开始创建这个或任何你可以获得的下载来创建效果。

感谢您的任何帮助

0 投票
2 回答
1153 浏览

jquery - Jquery.css 在 IE 和 Webkit(Chrome、Safari)上执行不需要的闪烁效果,但 Firefox 没问题

我有以下代码:

(注:ObjScrollASoda 是罐头的 jquery 对象)

这是复制 Trufa 提出的问题的小提琴:http: //jsfiddle.net/VcvJe/1/

在蓝色部分,有一个蓝色的罐子,它会随着页面“滚动”产生类似视差的效果。这是问题所在,因为我只是在用户滚动页面时设置 css,只有在 Chrome(和其他 webkit 浏览器)中才会出现闪烁效果(不需要)。我注意到它并没有在 Firefox 中发生。有谁知道如何避免这种“闪烁”效果?

这是一个视频,可以更好地解释正在发生的事情: http ://www.youtube.com/watch?v=SqDmOx6XY-M

(对不起我的英语不好)

0 投票
1 回答
650 浏览

jquery - 带有 jQ​​uery Parallax 的 Buggy 滚动

在页面上:[链接删除]我正在使用https://github.com/richardshepherd/Parallax-Scrolling/插件。滚动是锯齿状和跳跃的有什么原因吗?我该如何解决这个问题?

0 投票
2 回答
8298 浏览

jquery - 让视差在 iPad 上工作

我一直在寻找和阅读很多关于视差效果的信息,我即将创建我的第一个视差网站。我主要担心的问题之一是让它在 iPad 上运行。我已经阅读并看到足够多的结论,Parallax 在 iPad 上效果不佳。

现在,在所有 Parallax 网站中,我发现有 2 个似乎在 iPad 上运行良好,但我仍然不知道他们在工作方面有何不同,有什么想法吗?

基本上我想知道的是视差站点之间有什么区别。我已经看到一些使用画布标签,而其他似乎只是调整顶部和左侧值,而其他似乎正在替换图像。此外,对于 iPad 友好的 Parallax 网站来说,最好的方法是什么。

我发现在 iPad 上运行良好的 2 个网站是:

http://www.nike.com/jumpman23/aj2012/

https://victoriabeckham.landrover.com/INT

谢谢。

0 投票
0 回答
746 浏览

javascript - Chrome 和 Safari 中的视差站点使图像在顶部消失

我正在为将来的项目制作视差网站进行测试,并且在 Chrome 和 Safari 中的图像出现问题。

在 Firefox 中,图像会向上滚动到网站顶部,但当使用 Chrome 和 Safari 滚动时,图像会在触摸浏览器顶部时立即消失。

在我的测试中,黄色和棕色幻灯片中都有图像(幻灯片 1 和 5)。

http://antonybearpark.co.uk/Parallax/

0 投票
3 回答
4479 浏览

javascript - 视差'背景图像/位置/附件'jQuery动画很紧张

这是分解...

  • 包装器(位置:相对;溢出:隐藏;)
    • 部分容器(位置:绝对)
      • 多个子部分

我附加了一个鼠标滚轮事件侦听器并为“section-container”的“顶部”位置设置动画(缓动)。随着该位置的变化,每个部分的“背景位置”会根据“部分容器”的“顶部”属性的位置垂直移动(通过 setTimeout() 持续更新)。

所有这些都可以正常工作,除了“背景位置”发生变化外,图像有点抖动。如果“背景附件”设置为“固定”,则不会发生这种情况……但我不希望这样。

Can anyone explain this, with a possible fix? I continually refer to the https://victoriabeckham.landrover.com/ site and can't figure out what they're doing differently to get theirs operating so efficiently.

0 投票
1 回答
1490 浏览

jquery - 使用“-webkit-overflow-scrolling: touch”的实时滚动事件

在使用 CSS“-webkit-overflow-scrolling: touch”时,我无法在 iOS 上获得实时的 scrollLeft 位置。

这是一个要演示的小提琴:http: //jsfiddle.net/WaMUq/

在桌面上滚动时,我会在滚动时获取实时 scrollLeft 数据,而在 iOS 上,我需要等到动量滚动停止后再向我发送 scrollLeft 数据。

我怎样才能解决这个问题?我正在尝试实时获取这些数据,以创建微妙的视差效果。我已经尝试过Stellar.jsScrollability.js,并且都遇到了等待滚动停止的相同问题。

0 投票
2 回答
5982 浏览

javascript - IE7-8 中的生涩视差

我已经在我正在开发的网站中引入了基本的视差效果。在 Chrome、Firefox 和 IE9 中运行流畅;但在 IE7 和 IE8 中确实很生涩。我查看了更复杂的网站,但没有看到像我得到的“急躁”之类的东西。我只使用了两个顶部带有扫描线纹理的图像。

有什么想法可能导致这种情况吗?

任何帮助表示赞赏,谢谢。

0 投票
5 回答
3652 浏览

jquery - 滚动到视口边缘时图像消失

我们中的一些人想知道为什么本教程演示中的图像一触到顶部就会消失 - 在演示中的幻灯片 3 上慢慢滚动:

http://webdesigntutsplus.s3.amazonaws.com/tuts/338_parallax/src/index.html

我无法弄清楚。教程在这里: http ://webdesign.tutsplus.com/tutorials/complete-websites/create-a-parallax-scrolling-website-using-stellar-js/

0 投票
3 回答
2569 浏览

cocos2d-iphone - 横向滚动游戏的最佳方法,cocos2d box2d

我正在尝试使用 cocos2d + box2d 在 ios 中开发一个类似忍者跳跃的游戏,并且可以无限滚动!(不需要视差滚动)无限滚动的最佳做法是什么

1:移动图层(即改变图层位置) 2:移动Camara 3:使用单层的视差滚动(即仅使用一个视差层以相同的速度)

或者任何其他更好的方法?