select box jquery transition not working

Question

I am trying to use this: http://abeautifulsite.net/blog/2011/01/jquery-selectbox-plugin/

to add a transition by default to my select-box.

This is the bit of JavaScript:

$(document).ready( function() {

    $("SELECT").selectBox()
    $("SELECT").click( function() { 
        $("SELECT").selectBox('settings', { 
            'menuTransition': 'slide',
            'menuSpeed' : 'fast' 
        });
    });

});

I can't seem to make it slide by default. What am I doing wrong? I was able to get it to work by including a separate button exactly like in the demo page. But I want it to use the slide animation by default and can't see/figure out what is wrong?

Answer 1

The selectBox plugin looked interesting so I tried it out and I believe your issue is that you are trying to dynamically set the transition type to slide but you want to create the selectBox with different settings than the default ones, try this:

$(document).ready( function() {
    $("SELECT").selectBox({
        menuTransition : 'slide',
        menuSpeed      : 'fast'
    });
});

Here is a working example of this solution: http://jsfiddle.net/jasper/APzDJ/