Question

I am working with a jQuery plugin that has the following snippet in it:

$(el).siblings( panelSelector )[(effect || activationEffect)](((effect == "show")?activationEffectSpeed:false),function(){ .. some stuff .. });

My concern isn’t really what it does in the context of the plugin, but more as to how it works.

I understand that we are first selecting the siblings of the element clicked, then I believe that we are checking which of the two, effect or activationEffect has a value, I start to get lost there. It looks like the function is a callback, but if it is I don’t understand what contains the callback.

Answer 1

The main thing you need to know to understand the code is that foo.bar and foo['bar'] are equal.

Let’s split it to make it even clearer:

var sibs = $(el).siblings(panelSelector);
sibs[(effect || activationEffect)](...);

The second line calls whatever method name is stored in effect or activationEffect (the first true-ish value wins) on sibs.

((effect == "show")?activationEffectSpeed:false) is the first argument of that call and function(){ ... } the second one.