Question

I have some pretty simple code:

var overlay = {
    show: function() {
        var width = $('#checkout-region').outerWidth();
        var height = $('#checkout-region').outerHeight();
        // Set vars and show
        $('#checkout-processing').css({
            'height': height + 'px',
            'width': width + 'px'
        }).fadeIn(300);
    },
    hide: function() {
        $('#checkout-processing').fadeOut(300);
    }
}

To just allow me to overlay.show(); and overlay.hide();. When I try to run them in the console (Chrome) I continue to get a (very useful) ‘undefined’. A simple console.log(‘ok’); shows the functions are there but I just can’t figure this one out.

It’s probably something stupid but I’m sleep deprived and have been working on this project way too long now. Any help is greatly appreciated.

Answer 1

Undefined is not an error, it’s a return value.

Those functions return Undefined because they have no return something; line.

if you are trying to debug your code, you should console.log your query results to see if your queries are returning the correct elements. like so:

console.log($('#checkout-processing'));

if this works, the element should be fading out.