如何在flickerplate jquery幻灯片中实现视差滚动效果

时间:2015-01-24 07:18:17

标签: javascript jquery html css

这让我开心! 是的,我已经下载了flickerplate的幻灯片脚本并且它正在100%工作,但是如果你去他们的网站查看他们的演示,Click here你会看到它有视差滚动效果。现在我也想使用那种视差滚动效果,但它们不包含它们的下载(我最初认为视差滚动效果随幻灯片放映而来)。

所以我一直在花费HOURS和HOURS试图找到这种视差滚动效果的源代码,对于我的生活,我找不到它!难以理解的是,他们将所有代码缩小,因此对于像我这样不是javascript专家的人来说,这几乎是无望的。

所以我不得不求助于尝试第三方视差滚动脚本Here,虽然我可以让这个脚本处理单个图像,但我没有成功将其实现到flickerplate脚本中(毫不奇怪)。

这是flickerplate脚本的标记:

<div class="flicker-example" data-block-text="false">
    <ul>
        <li data-background="santa-maria-inhaca-island-mozambique-01.jpg"></li>
        <li data-background="nhoxani-lodge-santa-maria-mozambique.jpg"></li>
        <li data-background="santa-maria-accommodation-inhaca-island.jpg"></li>
    </ul>
</div>

这是使用Parallax脚本的单个图像的标记:

<div class="parallax-window" data-parallax="scroll" data-image-src="braby-villa-self-catering.jpg">
</div>

显然问题是这个标记是每个图像(每个图像),所以我尝试将它与上面的闪烁标记中的列表项一起使用,但这不起作用 - 图像/背景消失。我假设有一些冲突。当尝试将第三方插件与另一个插件一起使用时,这就是问题。

如果我能找到与他们的演示页面中使用的flickerplate相同的视差滚动脚本,那么可能会更容易一些,但我无法获得任何信息......也许你可以?我只是想要它们的演示页面。

0 个答案:

没有答案