Question

我想模仿这个网页的左右滚动功能，左右箭头相应地平移div行：

http://www.stuartmcmillen.com/comics_en/rat-park/

我一直试图找到一些使得这个效果在firefox调试器中发生的javascript，但我是一个完整的前端菜鸟，我觉得我已经查看了页面上的每个脚本但我可以单击左箭头和右箭头时，找不到导致动画的原因。我尝试使用firefox探查器，但输出无法理解。如何找到负责此向左滚动动画的javascript？或者甚至是javascript？

Answer 1

大多数情况下，您可以检查元素并查找id属性或描述性类名，然后在脚本中搜索这些值，在这种情况下，箭头按钮的代码从页面源的第1770行开始，我发现它正在寻找id #left_arrow

Answer 2

试试这个：

脚本：

var cur = 1;
var 

max = $(".collectionsCnt2").children("li").length;

$(".button-right").click(function () {

    if (cur >= max) return;
    cur =  cur + (500/100 < max ? 500/100 : max);

    $(".collectionsCnt2").animate({
        marginLeft: "-=500px",
    }, 1000);

});

$(".button-left").click(function () {
    if (cur <= 1) return;
    cur =  cur - (500/100 < max ? 500/100 : max);
    $(".collectionsCnt2").animate({
        marginLeft: "+=500px",
    }, 1000);

});

Fiddle

可能这可以为你提供一些帮助。

Answer 3

那里有很多，很难快速找到结果......

我认为你在谈论幻灯片左/右箭头..查看http://red-canoe.com的样本。有时它更容易开始简单。 JS来自：

    Supersized - Fullscreen Slideshow jQuery Plugin
    Version : Core 3.2.1
    Site    : www.buildinternet.com/project/supersized
    Author  : Sam Dunn

如何找到对某些行为负责的脚本

3 个答案: