Question

我正在尝试建立像http://justinouellette.com/这样的网站。这里唯一的问题是我对代码感到困惑。我想使用JQuery而不是MooTools。

有人可以成为天使并编写演示吗？我希望能够使用超链接在帧之间切换。一个框架就是一个类。

谢谢！

Answer 1

如果您为next和prev选项设置指定元素（如箭头图片），则jQuery plugin Cycle可以执行此操作。

最近提出问题的其他人在他们的网站上获得了类似的效果（您可以通过the link in their question跟随EasySlider 1.7查看）。

就占用整个窗口而言，您可以看到in Firebug示例网站已将函数绑定到window.resize，refigure()，它将每个帧的高度和宽度设置为窗户的大小。将其转换为jQuery应该是可能的 - 也许是这样的：

$(document).ready(function() {
    $(window).resize(refigure());
});

和

function refigure() {
    $('.frame').height($(window).height);
    $('.frame').width($(window).width);
}

原始代码的refigure方法正在设置几个附加元素的维度 - 我认为是为了满足该页面的特定要求，并且可能是执行过渡动画的代码模块。

Answer 2

据我了解你的问题，你想要的是一个Carousel，你可以使用一个名为JCarousel的优秀JQuery插件。 Demo Here...

Answer 3

这是我能找到的最接近你需要的最接近开箱即用的Jquery插件： Step Carousel Viewer v1.8

详细信息在该页面上，以下是您可能感兴趣的内容（每个框架/面板是一个css类）：

Sample Step Carousel HTML：

<div id="mygallery" class="stepcarousel">
  <div class="belt">

    <div class="panel">
      Panel 1 content here...
    </div>

    <div class="panel">
      Panel 2 content here...
    </div>

    <div class="panel">
      Panel 3 content here...
    </div>

  </div>
</div>

棘手的部分是如何让每个面板占据整个页面，而踩踏按钮漂浮在它们上面。我会说更多的CSS问题。祝你好运！

使用JQuery在帧之间滑动？

3 个答案: