我们中的一些人想知道为什么本教程演示中的图像在触摸顶部后立即消失 - 在演示中的幻灯片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/
我正在使用Stellar.js jQuery插件创建一个视差滚动效果,但我不确定Stellar是否支持我想要完成的任务.我有基本的视差滚动影响正常工作(主要基于TutsPlus的本教程).
我想要完成的是在用户向下滚动页面时使用它,某些元素从所有不同的角度移动/动画到视图中 - 被绑定到滚动位置.例如,当用户向下滚动页面时,苹果从屏幕的右上方位置进入视图,并且当用户继续向下滚动页面时,苹果在对角线路径中朝向左下方位置移动.屏幕.如果用户向上滚动,苹果将以向后的方式沿着相同的路径继续.Stellar可以实现吗？我必须使用不同的插件吗？我可以使用另一个插件WITH Stellar来实现这种效果吗？
任何有关这方面的帮助将不胜感激.如果您需要更多信息,请告诉我.
谢谢!
我正在开发的应用程序仅支持纵向模式.但是,在iOS8中,现在已弃用的UIAlertView可以进入横向并显示其他一些小问题.为了解决这个问题,我决定UIAlertController尝试一下.它有效,但我有一个新问题仍然有点烦人.警报不再进入景观,但确实以视差运动为特色.我在UIAlertController视图中添加了一个标签和一个图像,但那些不具有视差的东西,这意味着当用户移动手机时它看起来很奇怪.
我正在寻找两种选择,但我找不到如何做其中任何一种.
第一个解决方案是禁用视差,看看我们如何在应用程序的任何地方不支持它.
第二种解决方案是将视差支持添加到标签和图像.
无论如何,这是一段代码:
UIAlertController *welcomeAlertController = [UIAlertController
alertControllerWithTitle:[NSString stringWithFormat:NSLocalizedString(@"Would you like to send %@ a message?", @"This message is displayed after adding a new message receiver. The %@ is the name of the receiver."), self.receiver.name]
message:@"\n\n\n\n\n\n\n\n"
preferredStyle:UIAlertControllerStyleAlert];
UIAlertAction *cancelAction = [UIAlertAction
actionWithTitle:NSLocalizedString(@"Skip", @"Skip: meaning user can skip a certain step.")
style:UIAlertActionStyleCancel
handler:^(UIAlertAction *action)
{
[self cancelButtonPressed];
}];
UIAlertAction *okAction = [UIAlertAction
actionWithTitle:NSLocalizedString(@"Send", @"Send: meaning user can send information to somewhere.")
style:UIAlertActionStyleDefault
handler:^(UIAlertAction …是否可以使用css过渡来制作背景图像的视差效果？视差应该比滚动慢,所以需要减速 - 是否可以用css做到这一点？或者如果没有,如何使用js/jquery做到最好？
我关心最佳性能脚本,因为我的网页有点过载.
有人可以告诉或展示如何做到这一点？我将非常感激.
我最近看到了苹果展示 iPhone 6S 的“设计”页面。他们对每部 iPhone 都使用了“视差效果”。我知道已经有现有的视差插件可用，但 Apple 具有甚至可以与“生涩”鼠标旋钮配合使用的平滑效果。我真的很想模仿那种效果。
当页面初始滚动不在加载时的顶部时，我正在努力解决滚动视差问题。我使用react-scroll-parallax库（https://www.npmjs.com/package/react-scroll-parallax）。为了解决我的问题，我尝试使用他们的建议https://www.npmjs.com/package/react-scroll-parallax#example-usage-of-context。
import { useEffect } from 'react';
import { useController } from 'react-scroll-parallax';
const ParallaxCache = () => {
const { parallaxController } = useController();
useEffect(() => {
const handler = () => {
parallaxController.update();
console.log(1);
};
window.addEventListener('load', handler);
return () => document.removeEventListener('load', handler);
}, [parallaxController]);
return null;
};
export default ParallaxCache;
我将 ParallaxCache 组件放在我的应用程序顶部（实际上是页面，因为它是 gatsby）。
但“加载”事件似乎不起作用。我也尝试过“DOMContentLoaded”，但结果相同。然而，其他事件（例如“滚动”或“调整大小”）可以正常工作，并且我的控制器会更新。我是否遗漏了某些内容或反应阻止使用此事件？
我正在尝试将 Relax.js 与 React 一起使用，但无法理解如何使用它。我能找到的只是https://www.npmjs.com/package/rellax#target-node。在那个链接中，他们给出了这个代码。
<div ref={ref => { this.rellaxRef = ref }}>
I’m that default chill speed of "-2"
</div>
var rellax = new Rellax(this.rellaxRef)
我如何使用带有 React 钩子的代码以及整个组件会是什么样子。这是组件的一个非常狭窄的视图。
我正在使用 Angular (v17) 并尝试按照文档实现图像的延迟加载，其中说
“NgOptimizedImage 不直接支持背景图像 css 属性，但它的设计目的是轻松适应将图像作为另一个元素背景的用例。”
我已经设法实现图像的延迟加载，但未能找到一种方法来复制在 css 中使用 with 时所具有的静态视差（滚动过去图像）background-image效果background-attachment: fixed。
有没有办法在 Angular 中使用延迟图像加载时创建这种视差效果？
我在那个耐克网站上玩Parallax滚动.所以我一直在使用scrollTop来确定用户在页面上的垂直位置,然后我一直根据对该值的更改调整元素的位置.
在这里,我舍入scrollTop值并记录它.我稍后会显示日志.
var distance = 60*(Math.round($(window).scrollTop()/60));
console.log(distance);
然后,在单击时,我调用此函数滚动到我传递的scrollTop值.
function goTo(n){
console.log('begin animating');
$('html,body').animate({scrollTop: n},2000);
}
这是问题,在动画制作之前,滚动顶部值会跳转到0.
所以我会在页面的中间位置记录下来:
begin animating
0
6240
6180
6120
// etc...
我定位东西的方式依赖于scrollTop值的准确性.所以我的问题是:
在完成动画之前,如何让scrollTop值保持跳转到0？
如果需要更多信息,请告诉我.
以下是该网站的实时版本:http://theblueeyeguy.com/moon/Illumination/
(点击'下一步'然后'上一个'来打破它)
在github上的skrollr的pausing.html示例中有代码,文档中根本没有解释.例如:
<div data-0="transform:translate(0,100%);" data-100p="transform:translate(0,0%)" data-_box-100p="" data-_box-200p="transform:translate(0,-100%)">
什么是data-100p属性？它在文档中没有提到
还有data-_box-100p =""是一个,我不明白它控制什么...暂停？在单独的html注释中,它暗示暂停的持续时间由常量"框"设置.所以这对data-_box有意义,但我不知道属性的其余部分(100p =""在一个案例和
我试图堆叠几个部分,每个部分都会暂停一个动画,我遇到控制skrollr暂停功能所涉及的逻辑问题