user2756554
user2756554

Reputation:

Trigger a function when window is only above 1030px - and on Re-size or load

How to make this following function trigger only when screen size is only above 1030px? (on re-size and on load) I tried to implement this line of code to it: var windowWidth = $(window).width(); if(windowWidth <= 1030){} but it didn't work.

    //Change Header On Scroll//
    $(window).scroll(function() {    
    var scroll = $(window).scrollTop();

    if (scroll >= 40) {
        $("#headerWrapper").addClass("headerDown");
        $("#logo1").hide();
        $("#logo2").show();
    } else {
        $("#headerWrapper").removeClass("headerDown");
        $("#logo2").hide();
        $("#logo1").show();
        }
    });

Upvotes: 0

Views: 73

Answers (2)

Todd
Todd

Reputation: 5454

I would do:

var w = window.innerWidth;
window.onresize = function(){
    w = window.innerWidth;
}

If (w >= 1030) {
    // your code here
}

Upvotes: 1

Connor Black
Connor Black

Reputation: 7181

If the conditional you used is if(windowWidth <= 1030) then it will only be true if the window is less than or equal to 1030.

Try this:

$(window).scroll(function() {

    var windowWidth = $(window).width();

    if (windowWidth >= 1030){
        // do yo' thang
    }
}

Upvotes: 1

Related Questions