gpt4 book ai didi

javascript - HTML body 标签上的 Parallax.js

转载 作者:行者123 更新时间:2023-11-28 18:04:52 25 4
gpt4 key购买 nike

我正在尝试在 html body 标记上使用 Parallax.js。

https://pixelcog.github.io/parallax.js/
https://github.com/pixelcog/parallax.js/

我向正文添加了 jQuery、视差路径和数据参数,但没有显示。

我尝试将js放在页眉和页脚中。我哪里出错了?

https://jsfiddle.net/kyttft92/

<body data-parallax="scroll" data-image-src="http://i.imgur.com/yXmsCmA.jpg">
<ul>
<li>parallax</li>
<li>parallax</li>
<li>parallax</li>
<li>parallax</li>
<li>parallax</li>
</ul>
</body>

body 添加类并使用 jQuery 手动调用也没有效果。

$('.parallax-window').parallax({imageSrc: 'http://i.imgur.com/yXmsCmA.jpg'});

这也是一个 cdnjs 文件:

<script src="https://cdnjs.cloudflare.com/ajax/libs/parallax.js/1.4.2/parallax.min.js"></script>

最佳答案

显然,您的错误与未加载资源或语法错误无关,而是与未阅读文档并尝试以不适合的方式使用它有关:

来自 Under The Hood :

What parallax.js will do is create a fixed-position element for each parallax image at the start of the document’s body. This mirror element will sit behind the other elements and match the position and dimensions of its target object.

这基本上意味着你不能视差 <body> ,因为它被用作效果的容器。 (它将尝试创建 <body> 的镜像并将其放置为 <body> 的子级。这有什么意义吗?)。

只需将其全部放入容器中,仅用于使用 parallax.js

<小时/>

附加说明:根据 Matt 的评论,parallax.js目前需要 jQuery 2.2.4 或更低版本才能正常工作。

关于javascript - HTML body 标签上的 Parallax.js,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42885986/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com