程序员经验分享-hwhale

Jquery视差滚动效果-多方向

2024-03-16

我需要为客户构建一个多方向 JQuery 视差页面 - 他们基本上希望它以与此类似的方式工作 -https://victoriabeckham.landrover.com/INT https://victoriabeckham.landrover.com/INT

我已经准备好了图稿，并找到了许多 jquery 库，它们允许我水平/垂直滚动 - 但我不确定如何在特定坐标处将两者组合在一起。 有人能指出我正确的方向吗？

编辑：我最初确实在研究了 Superscrolarama 并认为一切都已解决后签署了这篇文章 - 但在实现它时遇到了困难 - 我不认为它是我认为的救世主，我需要水平和垂直视差以及滚动到实现上述目标，它似乎不支持 - 所以我将非常感激任何其他提示！


我把一些东西放在一起对你来说就是jsfiddle。

http://jsfiddle.net/9R4hZ/40/ http://jsfiddle.net/9R4hZ/40/

该脚本首先初始化所有对象的起始位置。然后为箭头键和鼠标滚轮设置处理程序。之后是 parallaxScroll 函数中算法的核心部分。

它使用箭头或鼠标轮进行滚动。

有从[左、右、上、下]的过渡。

HTML 和 CSS 非常简单。

运行它的 JS/jQuery 是不言自明的。

这是一个有趣的效果，似乎适合艺术类型的网站。

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

javascript

jQuery

html

css

Parallax

Jquery视差滚动效果-多方向 的相关文章

随机推荐

  • jQuery 匹配多个类

    我第一次遇到这种不寻常的情况 我必须选择一个应用了 2 个以上类的 div 即以随机顺序 例如 假设我有一个 应用了以下 3 个类 内容文本 右对齐和粗体字体 我需要选择这个 div 但问题是类在不同页面上以不同顺序应用 div class

  • Python 按键错误和 for 循环中的重复代码

    我收到一条错误消息 回溯 最近一次调用最后一次 文件 Users user PycharmProjects SSW 540 P8 hajayi py 第 34 行 位于 字母计数 ch 1 关键错误 n 我还注意到打印语句正在重复 我认为这

  • 使用 ngrx 的应用程序的最佳结构是什么？

    结构1 reducers index ts Combine all reducers user reducer ts product reducer ts actions index ts Combine all actions user

  • 如何在Java中使用postgresql

    我安装了 postgresql 及其驱动程序 postgresql 9 3 1102 jdbc41 jar 我的目录看起来像 gt SQL gt myJDBC java gt postgresql 9 3 1102 jdbc41 jar 我

  • 如何在mysql中使用sql join

    表名 tbl schedule tr id P K mr id F K sch date doctor id 1 23 01 01 2012 32 2 23 05 01 2012 13 3 22 08 01 2012 14 表名 tbl u

  • Boost - 子进程仍然是僵尸进程

    我编写了简单的代码 以分离的方式运行子进程 boost process child childProcess sleep 10 boost process std in close boost process std out close c

  • 在 Github 上托管 ipython 笔记本

    我维护一个 Github 存储库 当前包含两个 ipython 笔记本文件 我的存储库在这里 https github com tschm MosekRegression https github com tschm MosekRegres

  • 不可重现的 R 包可用性检查

    在检查软件包向量是否需要安装时 我遇到了一个有趣的错误 要求并卸载 lme4 命名空间会在第二次执行时出现错误 但仅当按特定顺序检查其他一些包时才会出现错误 isInstalled lt function package is a pack

  • 有没有办法在Python中使用PhantomJS？

    我想用PhantomJS http phantomjs org in Python http www python org 我用谷歌搜索了这个问题但找不到正确的解决方案 I find os popen 可能是一个不错的选择 但我无法向它传递

  • 具有多个数据库服务器的 ServiceStack OrmLite

    我正在围绕服务堆栈框架构建一个应用程序 并且需要能够访问 Oracle 和 MS Sql Server 中的数据 使用 ORMLite 是否可以做到这一点 似乎我只能为应用程序设置一种方言 或者我错过了什么 是的 这是可能的 并且对此的支持

  • 在 Spring Boot 中全局启用 CORS

    我尝试像这样全局启用 CORS Configuration ComponentScan com example EnableWebMvc public class OriginFilter extends WebMvcConfigurerA

  • 无法在装饰器中捕获 pytest 的结果

    我的 pytest 测试装饰器在调用函数后立即退出装饰器 如果我使用 python 而不是 pytest 运行该文件 效果会很好 这是代码 def dec func def wrapper args kwargs print do some

  • JFreeChart 不会在线程上的每次迭代时显示图形？

    我使用线程在一个类中获取计数器值并写入JFreeChart在另一个线程中 执行时 它交替工作 但只显示最后的图形 它还将 y 轴标签值显示为 Float 但实际检索值是 int 我该如何解决这些问题 XYDataset Dataset Ti

  • 在 Rails 中，哪里是放置需要“随处”可用的方法的正确位置

    我已经将许多小实用方法 例如用于重新格式化或解析字符串等简单对象 放入了 ApplicationHelper 中 但是 模型中的类方法显然无法访问 ApplicationHelper 方法 有一个解决方法 那就是在我的项目中进行洒水 inc

  • 在 Java 中动态加载模块（类）的最佳方法

    我目前正在编写一个需要在不同类型的设备上运行的应用程序 我的方法是制作一个 模块化 应用程序 可以根据需要操作的设备动态加载不同的类 为了使应用程序易于扩展 我的目标是为附加模块 jar 或 class 文件 分配特定路径 而核心程序保持原

  • 如何获取和设置当前网页滚动位置？

    如何获取和设置当前网页滚动位置 我有一个很长的表单 需要根据用户操作 输入进行刷新 发生这种情况时 页面会重置到最顶部 这对用户来说很烦人 因为他们必须向下滚动回到原来的位置 如果我可以在页面重新加载之前捕获当前滚动位置 在隐藏输入中 那么

  • 如何列出包中的所有类和方法/函数 - 具有完整的文件夹/文件路径？

    为了更好地理解包的结构 假设我们有一些包 模块 比如说 somemodule 结构如下 somemodule file1 py fo x a function file2 py bar x a function dir1 file3 py

  • 在 Rails 应用程序中实现投票的最佳方式？

    目前在 Rails 站点上实现投票的最佳插件是什么 我知道的两个是 vote fu http github com peteonrails vote fu 行为可投票 http github com ryanto acts as votab

  • JPA CriteriaBuilder 案例查询

    任何人都可以提供如何使用编写案例查询的示例CriteriaBuilder 以下是使用的示例案例表达式CriteriaBuilder 这适用于 JPA 2 Hashtable caseTable new Hashtable 3 caseTab

  • Jquery视差滚动效果-多方向

    我需要为客户构建一个多方向 JQuery 视差页面 他们基本上希望它以与此类似的方式工作 https victoriabeckham landrover com INT https victoriabeckham landrover com

热门标签