Question

Here’s the basic idea of what I’m trying to accomplish, I have a list…

<ul>
<li position="400">Item 1</li>
<li position="510">Item 2</li>
<li position="590">Item 3</li>
<li position="614">Item 4</li>
</ul>

And what I would like to do is select the closest item based on a number.

If our random number was 490, it would add the class “selected” to the list Item 2.

But I don’t know how to do this, or if it’s even possible… I’m doing this for navigation purposes, so…

var position = $(window).scrollTop();

then on keypress, select list item with the position attribute closest to the “position” variable. Am I making sense?

If anyone could help walk me through this I’d appreciate it, I’m lost

Answer 1

function selectClosest(val){
var diffs = [];
$("li[position]").each(function(){
    diffs.push(Math.abs(parseInt($(this).attr("position"))-val));
});
$("li[position]").eq(diffs.indexOf(Math.min.apply( Math,diffs))).css("font-weight","bold");
}

selectClosest(551);