Question

I am trying to add the next and prev button for both thumbnail and larger image gallery. And that next and prev button should support the keyboard event listeners too.

This is the link which I have tried.

http://jsfiddle.net/L7yKp/36/

I need some help.

Answer 1

See http://jsfiddle.net/L7yKp/37/

The problem is

$(['next','prev']).each(function(){
    var that=this;
    $('#'+that).click(function(){
        $('#thumbs img.clicked')[that]().click();
    });
});

because now you have

<a href="#" id="tnext">Next</a>
<a href="#" id="tprev">Prev</a>

and

<a href="#" id="lnext">Next</a>
<a href="#" id="lprev">Prev</a>

So the solution is;

$(['next','prev']).each(function(){
    var that=this;
    $('.'+that).click(function(){
        $('#thumbs .clicked')[that]().click();
    });
});

and

<a href="#" class="next">Next</a>
<a href="#" class="prev">Prev</a>