Window resize event

Question

var windowWidth = $(window).width();    
function mobileResponsiveCheck(){
    if(windowWidth >= 768){
        box3Responsiveness();
    }else if(windowWidth < 768){
        null;
    }
}

$(window).resize(function(){
    mobileResponsiveCheck();
});
mobileResponsiveCheck();

So I want to run the function mobileResponsiveCheck() every time the user resizes and also if reloaded. While resizing if window gets smaller than 768px then it is supposed to do nothing. But this only happens when I reload it after it is smaller than 768px. What I want is it box3Responsiveness() stopped as the user is resizing and get below 768px without reload.

You can simplify else if(windowWidth < 768) to just else — Blazemonger
– Blazemonger, Commented Feb 14, 2017 at 15:36
^ or just remove that condition entirely, as null is redundant code — Rory McCrossan
– Rory McCrossan, Commented Feb 14, 2017 at 15:37
It's not clear how you stop box3Responsiveness() from running. We can't tell from your code sample. — Blazemonger
– Blazemonger, Commented Feb 14, 2017 at 15:38

Bram Vanroy · Accepted Answer · 2017-02-14 15:37:47Z

3

You defined windowWidth globally. The variable is set once, namely when the script first runs. However, the value does not change on resize because you don't tell it to. To change that, bring the variable declaration inside your function. That way it will always change when necessary.

function mobileResponsiveCheck(){
    var windowWidth = $(window).width();  
    if(windowWidth >= 768){
        box3Responsiveness();
    }
}

$(window).resize(function(){
    mobileResponsiveCheck();
});
mobileResponsiveCheck();

answered Feb 14, 2017 at 15:37

Bram Vanroy

28.8k28 gold badges151 silver badges266 bronze badges

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

2 Comments

Manu Karki Over a year ago

It worked and it didn't. box3Responsiveness() starts while up-sizing but doesn't stop while downsizing. Am I missing something?

Bram Vanroy Over a year ago

In your original code you had nothing that stopped box3Responsiveness. You had a redundant else-if clause with null in it - which doesn't do anything. Without the content of the box3Responsiveness function we cannot help you. That's outside the scope of this question though. Mark an answer as correct, and create a new topic.

thesublimeobject · Accepted Answer · 2017-02-14 15:41:30Z

0

mobileResponsiveCheck() {
  if (window.innerWidth >= 768){
    box3Responsiveness();
  }
}

window.addEventListener('resize', mobileResponsiveCheck);
mobileResponsiveCheck();

answered Feb 14, 2017 at 15:41

thesublimeobject

1,4031 gold badge19 silver badges22 bronze badges

Collectives™ on Stack Overflow

Window resize event

2 Answers 2

2 Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Related