Question

I’m currently using this:

if ( $.support.touch == true ) {
    $(window).on('orientationchange', function(event){
        if ( full == false ) {
            self.hideAllPanels("7");
        }
    });
} else {
    $(window).on('orientationchange resize', function(event){
        if ( full == false ) {
            self.hideAllPanels("7");
        }
    });
}

because I’m getting a lot of resize events triggered on touch devices, when I don’t need them.

I also tried the following syntax:

$(window).on( ( 'orientationchange'+ ( $.support.touch ? '': ' resize') ), function(event){
    ...
});

but this produces an error in Firefox (app.start() not defined on line 1` – which is my application, so this doesn’t tell me much). Switching back to the first syntax, everything works fine again.

Question:
Is it possible to dynamically set the events I want to bind to? If so, what would be the correct synatx in this case?

Thanks!

Answer 1

Can minimize code repetition doing something like this:

 var events = $.support.touch ? 'orientationchange' : 'orientationchange resize';

$(window).on(events, function(event) {
    if (full == false) {
        self.hideAllPanels("7");
    }
});