jQuery assign index to variable on hover

Question

I'm using this script to toggle a class between a group of DIVs.

The keyboard nav works great, but if you mouse over a DIV, and then switch back to using your keyboard, you will notice the script does not remember the last DIV you moused over. It will continue to remember the last DIV you navigated to by keyboard.

Here is a JSFiddle demonstrating the problem: http://jsfiddle.net/bupGk/

What I am looking for is the correct equation that will calculate the index value for any given DIV on hover, with the class of column.

jQuery

var i = -1;
var all = $('.column');     

$('.column').hover(function(){ 
    $('.column').removeClass('scroll'), 
    $(this).addClass('scroll'), 
    i = $(this).eq() /*problem area*/
});

function traverse(ele) {
    all.removeClass("scroll");
    all.eq(ele).addClass("scroll");
}

$(document).keydown(function(e){

    if (e.which == 37) {
        e.preventDefault();
        traverse( i = !i ? all.length - 1 : --i );
    }

    if (e.which == 39) {
        e.preventDefault();
        traverse( i = ++i % all.length );
    }

});

Vigrond · Accepted Answer · 2011-12-01 22:29:09Z

1

Try this:

i = $(this).index()-1

Index() without params gives the index relative to its sibling elements. fiddle: http://jsfiddle.net/bgg92/

eq() returns a jQuery object, not an integer.

eq() http://api.jquery.com/eq/

index() http://api.jquery.com/index/

edited Dec 1, 2011 at 22:29

answered Dec 1, 2011 at 22:01

Vigrond

8,1984 gold badges31 silver badges47 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

colindunn Over a year ago

Thank you! I had to change the code to i = $(this).index()-2 for my application, but it works perfectly.

maxedison · Accepted Answer · 2011-12-01 22:01:46Z

0

Rather than i = $(this).eq(), use i = $(this).index().

Here's an example using your fiddle that will log i to the console: http://jsfiddle.net/bupGk/1/

answered Dec 1, 2011 at 22:01

maxedison

17.6k15 gold badges72 silver badges118 bronze badges

Collectives™ on Stack Overflow

jQuery assign index to variable on hover

2 Answers 2

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related