$.when($("").function() == true).then() not working as expected

I have a function which returns true or false. Now I’d like to execute some code once the function returns “true”.

The function determines if an element is visible on screen. I took it from here.

The element is displayed 1-2 seconds after the page is loaded. But as this is also related to the internet connection of the user, I don’t want to use a setTimout function.
I tried a few things and found out, that it works in an if/else statement, but not in a when/then. Any ideas, what is going wrong here?

I tested a few things, see below the code

//below if else statement works fine and logs the correct result
    if($(".myClass").isOnScreen()==true){
        console.log("true");
    }
    else{console.log("false");}

//however i would like to use this one and it doesn't seem to work
$.when($(".myClass").isOnScreen()==true).then(function(){
    console.log($(".myClass").isOnScreen());
    setTimeout(function(){
        console.log($(".myClass").isOnScreen());
    },1000);
});

What the when / then statement actually does:
It runs as soon as the function isOnScreen is running, but doesn’t wait until the return response is true. Therefore the console log is always false.
I then implemented a timeOut (just for testing purposes). After the timeOut ran through, the console log is always false.

What it should do:
The when / the statement should run after the result turns to true.



The logic you linked to is designed to be used within a scroll event handler. It doesn’t return a promise and isn’t supposed to be used with one.

To solve your issue, use the plugin like this: