Question

I have a basic conditional statement that has a chaining function. After the else method there is a callback of show() that doesn’t fire.

What do I have wrong? Syntax??

Thnx

var closeList = $('#west');

    $('#menuToggle').click(function(){
        var p = $('#west').css('display');
        if (p != "block") {
            $('#contentBox').width('70%', function() {
                $('#west').show(); // <--THIS DOESNT FIRE!!
            });
        } else {
            $('#west').hide();
            $('#contentBox').width('98%');
        }
    });

HTML

<!-- ------------------------- Main Content -------------------- -->
    <div id="wrapper" class="wrapperPosition">

        <div id="west">
        </div>

        <div id="contentBox">
            <div id="content" class="contentPosition"></div>
        </div>
    </div>

Answer 1

Call them in sequence rather than with a callback:

if (p != "block") {
    $('#contentBox').width('70%');
    $('#west').show();
}

The issue is that .width() doesn’t have an option that accepts both a value and a function, only one or the other:

.width( value )
.width( function(index, width) )

So, pairing it with a value means the function will be ignored.

---

To elaborate on my comment:

if ($('#west').is(':hidden')) {
    $('#contentBox').width('70%');
    setTimeout(function () {
        $('#west').show();
    }, 10);
}