Search code examples
javascriptjqueryzurb-foundationzurb-foundation-6

Foundation.MediaQuery.current in a loop (first iteration always shows nothing, next are always correct)


I use Foundation.MediaQuery.current to determine current breakpoint. Every time I call console.log(Foundation.MediaQuery.current) for the first time (n=0) I get nothing.

For all next calls (n>0) I always get correct breakpoint, let's say large.

This is my function:

_calculateLimit = function () {
    var postsInjectedCount = container.find('.post-appended').length;

    console.log(Foundation.MediaQuery.current);

    if (Foundation.MediaQuery.current === 'large') { // gives nothing on first iteration :/
        return postsInjectedCount % 3 !== 0 ? 2 : 3;
    }

    return postsInjectedCount % 2 !== 0 ? 1 : 2;
},

Below picture shows a screen from my Chrome Dev Tools.

enter image description here

Helpful info 1: There is no difference in terms of business logic between first call and next calls.

Helpful info 2: I use Foundation For Sites ~6.2.1

What am I doing wrong?


Solution

  • It looks like you are running the code before Foundation has initialized. It is a good practice to put the init code at the top of JavaScript file.