问题标签 [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.
javascript - jQuery视差效果问题
我身体背景的 jQuery 视差效果有问题。这是代码:
这段代码很棒,但是在我添加了带有徽标和导航菜单的标题后,它们关闭了部分背景,所以现在看起来不够好。这里也是链接http://layot.prestatrend.com/顺便说一下,我的标题高度是 129px。似乎我需要制作 background-position +129px 但无法弄清楚如何使其与 javascript 一起正常工作。请问有什么帮助吗?
jquery - 使用 Scrolling Parallax jQuery 插件时保持图像纵横比不变
我正在使用Scrolling Parallax jQuery 插件来滚动此站点上的“背景”图像(实际上不是 css 背景图像)。
是否可以保持图像纵横比,即不挤压图像,并且仍然可以在所有现代浏览器中使用?
我尝试设置bgHeight : 'auto'
将图像 css 设置为height:auto
,但这会阻止滚动效果在 Chrome 和 Safari 中工作。
我也尝试过设置bgWidth : 'auto'
,但图像比浏览器窗口窄。
也开放到其他插件或实现此效果的方式,即背景图像以不同的速度滚动到页面内容,并且还显示整个图像,但不滚动过去......
提前感谢您的帮助!
background - 修复了滚动查看器 Windows Metro 中的背景(非视差)
我正在尝试将纹理作为背景添加到滚动查看器。我希望背景随内容移动,但我希望它固定。不使用视差效果...
到目前为止,我得到的是:
后面的代码:
正如您在事件侦听器 (UpdateBackgroundImagePosition) 中看到的那样,我必须将 HorizontalOffset 乘以 2 才能使背景与内容固定。但是当我移动滚动条的内容时,背景并没有固定在内容的位置,移动有点不同,有点慢,然后在正确的位置结束动画。
关于如何获得它的任何建议,或者默认情况下窗口是否“强制”使用视差背景?
谢谢,
jquery - 视差双向滚动
我正在尝试在Scrollorama的帮助下创建视差滚动站点,但我想使用非典型动画。此动画应该从上到下,然后在页面中间停止并返回(从中间到顶部)。Scrollorama作者说scrollorama不支持这种动画,他的新插件SuperScrollorama也不支持。也许有人可以向我推荐另一个具有此功能的插件。
jquery - 基于图像位置的视差效果
我仍在为基于 3 个级别的客户开发视差网站。我遇到了一个问题,使我无法添加到第三个顶层。
该站点本身具有以一种速度滚动的全屏背景。它是一个非常长的垂直图像,滚动缓慢。最重要的是以标准速度滚动的内容。
第三层是简单的位置:位于某些内容区域之上的绝对图形。基本上是浮动图像。
我遇到的问题是,对于我尝试过的大多数视差插件,浮动的第三级图像没有任何东西可以消失。这意味着虽然我可以在更改后立即根据屏幕尺寸设置它们,但我看到它消失在一条看不见的线后面。
我可以使用任何插件或方法来阻止这种情况发生吗?所以本质上我想设置图像所在的位置,如果视差效果不起作用,并且它围绕该点产生视差。
javascript - HBO 使用哪个视差库?
http://www.hbogo.com/product-tour/
我从他们的(缩小的)代码中看到它使用了一个 jQuery 插件,该插件使用 jQuery.fn.parallaxing 对其进行了扩展,但我无法找到任何使用 .parallaxing 的 github 项目。
有谁知道他们用的是什么插件?或者它是专有的?它非常流畅,我所有尝试复制附加到滚动条的类似内容的尝试都让浏览器陷入了爬行,所以我试图弄清楚它们的不同之处。
javascript - 停止 JavaScript 函数排队,一次允许一个函数
scrollTo
正如您从http://www.adamdodds.co.uk/blue-leaf中看到的那样,我一直在玩视差和。当您单击时间线时,它会贯穿所有内容,但是当您在最后运行时单击一些东西时,它会全部完成。我如何使它可以运行一个功能而无需更多排队?
html - 悬停滚动 Div 视差
我正在尝试重新创建该站点的主页... http://spooz-creation.com/
我想在用户窗口(蓝色)中左右滑动一个包含其他 div(黄色)的大 div(绿色)。加载后,内容 div(绿色)将像示例站点一样位于用户窗口的中心。还有一个带有导航元素的静态标题(粉红色)。
我真的希望滚动像示例站点一样悬停激活。此外,我希望内容 giv(绿色)高度根据用户窗口高度灵活。
在所有这些之上添加视差效果将是史诗般的,但如果复杂,则并非完全需要。
!!!!!!(线框示例)!!!!!! http://lpaoriginal.files.wordpress.com/2012/07/desktop.jpg
请帮忙!几天来我一直在努力解决这个问题!
css - CSS3 滑块 - 相对 div 内的绝对定位,用于响应式幻灯片
我正在修改从http://tympanus.net/codrops/2012/03/15/parallax-content-slider-with-css3-and-jquery/获得的一些 CSS 代码。它是一个视差 CSS3 滑块。
我几乎尝试了所有方法,但我的问题是我无法在浏览器中以固定的最大宽度居中滑动 div(da.slide)。最大宽度为 970 像素,当浏览器调整大小时会缩小。我已经尝试使用margin: 0 auto
并且left:50%
它现在仍在工作 - 它只是挂在左边。
我认为可能的问题是滑块 div 的定位。当我将它从绝对更改为相对时,它适用于第一张幻灯片,但其余幻灯片消失/在彼此下方滑动。有没有机会使滑动 div 居中?
这是CSS3代码:
HTML 是:
任何帮助将不胜感激!
javascript - 视差“滚动”仅通过导航
由于我还是 Javascript/Jquery/HTML5/CSS3 的新手,我想我会向所有更有经验的程序员提问。
我有点卡在我的程序逻辑的开头。我想做一个具有视差“滚动”效果的网站,但是只有当用户单击屏幕边缘的导航按钮时才会产生这种效果。
网站的布局将是这样的:
“O”是内容 div,“X”是“主页”页面(起点)。如果用户单击屏幕顶部的箭头(从原点开始),页面将向上滚动。其他任何方向也是如此。我想要一张背景中机构的巨型照片,它使用视差效果根据他们“滚动”到的特定内容 div 来改变它的位置。
这两天我一直在绞尽脑汁想弄清楚从哪里开始。任何帮助将不胜感激,如果我需要更具体地说明某些事情,请告诉我。谢谢!