Help: Recreating Gallery Functionality

[mr.sly]

Hi.

I'm looking to create a portfolio page that has the same functionality as this site here. Below each project image if you press "Next" it will cycle through the images for the project (easy enough), but once it reaches the end of the gallery, it moves to the next project.

Can somebody point me in the right direction to learn how to do this or what that functionality is called, so I can take a look myself.

Thanks.

 

[mr.sly]

Nobody got any ideas or able to point me in the right direction?

 

[Dj_Jestar]

"Carousel" plugin/applet/feature/thingy/doobrey/wotsit.

 

[Pho]

They use jQuery + Easy Slider.

Here's their (deobfrusticated) code to do it, hence the messyness.

$(document).ready(function () {
    var i = function (l) {
        var h = j();
        $("p.meta").text(l + " of " + h)
    };
    var j = function () {
        return $(".vertical_wrap ul").children().length
    };
    var c = function () {
        return $("ul.gallery li").index($("ul.gallery li.ui-state-active"))
    };
    var g = function () {
        return $("ul.gallery li").length
    };
    var a = function (h) {
        window.top.location = $("ul.gallery li").eq(h).find("a").attr("href")
    };
    var k = function () {
        var h = $("#gallery_list li ul li").get($("#gallery_list li ul li").index($("li.ui-state-active")));
        return $("#gallery_list > li").index($(h).parent().parent())
    };
    var b = function (q, l) {
        var p = parseInt($(".vertical_wrap ul").css("width"), 10) / j();
        var o = parseInt($(".vertical_wrap ul").css("margin-left"), 10);
        var m = -o / p;
        var n = m + 1;
        i(n);
        if (q) {
            var h = c();
            if (h == -1) {
                return
            }
            if (h == 0) {
                a(g() - 1)
            } else {
                if (h > 0) {
                    a(h - 1)
                }
            }
        } else {
            if (l) {
                var h = c();
                if (h == -1) {
                    return
                }
                if (h == g() - 1) {
                    a(0)
                } else {
                    if (h >= 0) {
                        a(h + 1)
                    }
                }
            }
        }
    };
    $(".vertical_wrap").easySlider({
        prevId: "previous",
        nextId: "next",
        callBack: b
    });
    $("#gallery_list").easySlider({
        selector: "> li",
        prevId: "back",
        nextId: "more",
        orientation: "vertical",
        speed: 500
    });
    var f = k();
    var e = $("#gallery_list");
    var d = e.height();
    e.find("ul:first").css("marginTop", -f * d);
    $(".gallery_image").click(function () {
        $("#next").click()
    })
});

 

[mr.sly]

Thanks for the reply. I'm guessing the above code only controls the actual gallery and not how to moves to the next project at the end of the gallery?

I'll take a look through it now and see if I can figure it out.