Question

I have an else..if statement that assigns a value to a variable based on the window.width, what I would like to do is then use this value inside a window.resize but at the moment get 'undefined' for currentSize the value. What should I be doing in order to get the value?

JS

//Code ran onload
if(windowWidth >= 924) {
    incrementValue = 3;
    currentSize = 'desktop';
}
else if(windowWidth > 615 && windowWidth < 924) {
    incrementValue = 2;
    currentSize = 'tablet';
}
else {
    incrementValue = 1;
    currentSize = 'mobile';
}

$(window).resize(function() {
    windowWidth = $(window).width();

    if(windowWidth >= 924) {
        incrementValue = 3;
        var newSize = 'desktop';
    }
    else if(windowWidth > 615 && windowWidth < 924) {
        incrementValue = 2;
        var newSize = 'tablet';
    }
    else {
        incrementValue = 1;
        var newSize = 'mobile';
    }

    console.log(currentSize); //'undefined'
    if (currentSize !== newSize) {
        var currentSize = newSize;

        incrementTotal = 0;
        slideIndex = 0;

        //Reset slider to start
        $carouselSlides.css( 'left', 0 );
    }
});

Answer 1

Don’t redefine currentSize with var like this

if (currentSize !== newSize) {
    var currentSize = newSize;

Remove the var

if (currentSize !== newSize) {
    currentSize = newSize;

Here is an example which allows you to reproduce or eliminate your error depending on the presence of var:

• http://jsfiddle.net/94zVg/2/
• http://jsfiddle.net/94zVg/3/