Question

I have a div selector script with icons as pagination that I’m working on. So far everything is working well, the question I have is how can I change the active state of a an icon dependent on the div or “page” that is currently being shown. Here is a simple example of what I have so far. The images being used for the navigation right now are clickable as well.

Here is the example:
http://jsfiddle.net/Rua2B/

Thanks for any possible help!

EDIT: Just to clear things up I mainly trying to get active states to change when the “prev” and “next” buttons are hit.

Answer 1

Your code for pagination isn’t the most efficient – you should look into tidying this up. But a simple fix for you for next/prev buttons is this line:

$("#pager img").removeClass("active").eq($("#container .boxes:visible").index()).addClass("active");

DEMO: http://jsfiddle.net/Rua2B/1/