If-statement always returning true in jQuery

Question

Similar questions have been asked, but I cannot find any help in those topics.

Take a look at this fiddle. There's a menu on the right, which allows you to scroll to other sections.

What should happen is that when you click "3" for instance, "3" in the menu gets the class "visible" (shown by a larger font size). For some reason or another, however, the first list item always gets this class. I think this happens because in the if-statement below, the first div is evaluated as true for having an offset of zero, which is not correct.

    $("body > div").each(function () {
        var $this = $(this),
            nextSection = $this.next("div"),
            offsetT = $this.offset().top;
        if (offsetT == 0) {
            $("nav a").removeClass("visible");
            $("a#" + $this.attr("id") + "-button").addClass("visible");
            console.log("a#" + $this.attr("id") + "-button");
        }
    });

Another explanation might be that something goes wrong because the function is called as a callback. I did so intentionally because when it is called as a callback, there should eb no animation left, and a container should be snapped to the top of the window: so there can only be one element that has offset == 0. But as you can see, this does not work.

The class must be set inside the SnapIt function, because the function is used else where as well.

Where did I go wrong?

It this what you want? http://jsfiddle.net/dtQwr/4/ – j809 Jul 17 '14 at 14:33 — j809, Jul 17 '14 at 14:33

score 1 · Answer 1 · answered Jul 17 '14 at 14:42

I think you want when you scroll the correct number is selected then you need to change:
if (offsetT == 0) to if (offsetT == posToScroll)

Fiddle

Rational

if (offsetT == 0) will always select menu item one because the offset of this menu item is 0. Changing the if statement to if (offsetT == posToScroll) is saying select the one the window has scrolled to.

score 0 · Accepted Answer · answered Jul 17 '14 at 14:32

0

The first <div> always gets the class because it's the one at top of the window so It has 0 offset. hence

if (offsetT == 0) {

Only evaluates to true in it's case.

answered Jul 17 '14 at 14:32

T J

42,762
13
83
138

You are right, I'm wrong. I wanted to compare to the viewable area, which should be found as follows: `el.offset().top - $(window).scrollTop()`. – Bram Vanroy Jul 17 '14 at 14:45

If-statement always returning true in jQuery

2 Answers2

Rational