0

我必须为我的客户制作一个单页网站，而 Ascensor.js 插件似乎可以完成我需要它做的所有事情。但是，我终其一生都无法让它发挥作用。

http://kirkas.ch/ascensor/#/Home

最初我试图让它在 WordPress 主题中工作，但我放弃了，并试图让它完全像网站上的例子一样工作，没有乐趣。

这是代码；

<!DOCTYPE html>
<html>
<head>

<script type="text/javascript" src="./js/jquery-1.9.0.min.js"></script>
<script type="text/javascript" src="./js/jquery.ascensor.js"></script>  
<script type="text/javascript" src="./js/jquery.scrollTo-min.js"></script>

</head>

<body>

<script>

$('#ascensorBuilding').ascensor({
AscensorName:'ascensor',
ChildType:'section',
AscensorFloorName:'Home | Implementation | HTML',
Time:1000,
WindowsOn:1,
Direction:'chocolate',
AscensorMap:'2|1 & 2|2 & 3|2',
Easing:'easeInOutQuad',
KeyNavigation:true,
Queued:false,

});

</script>

<div id="ascensorBuilding">
    <section>
        <article class="container_12">
            <h1>Home</h1>
        </article>
    </section>

    <section>
        <article class="container_12">
            <h1>About</h1>
        </article>
    </section>

    <section>
        <article class="container_12">
            <h1>Contact</h1>
        </article>
    </section>
</div>
</body>
</html>

这确实应该起作用，因为我完全按照示例进行了操作。我已经尝试过使用和不使用文章元素上的类（我认为插件应该创建这些）。有没有人有这个插件的经验可以给我一些帮助？

提前致谢！

4

2 回答 2

1

我将在这里留下一个我正在使用 ascensor 做的简单工作。随意获取您想要的所有代码。请记住将“overflow:auto”设置为css中的“section”标签，并将“overflow:hidden”设置为您用于建筑物的div，在我的例子中是#house。

http://www.thegrowth.eu/mari/index.php

我正在使用的插件版本不适用于当前的 jQuery 版本，除非您破解代码。坚持 1.8.3 版，你可以从我的网站上获取它。此外，您只需要 jQuery-UI 即可使用 ascensor 的一些缓动功能等。

并原谅我的英语：p

于 2013-05-25T07:36:12.227 回答
1

首先你需要用 jQuery.ready 包装你的代码

$(function(){
    $('#ascensorBuilding').ascensor({
        AscensorName:'ascensor',
        ChildType:'section',
        AscensorFloorName:'Home | Implementation | HTML',
        Time:1000,
        WindowsOn:1,
        Direction:'chocolate',
        AscensorMap:'2|1 & 2|2 & 3|2',
        Easing:'easeInOutQuad',
        KeyNavigation:true,
        Queued:false,
    });
});

您缺少迁移插件和缓动插件。

演示：小提琴

于 2013-01-29T15:08:57.553 回答