Very handy, thanks Choan.
By the way the little code rewrite I posted uses .next() because it assumes
the elements are siblings (which was ok for my purposes).
Jorn's technique, which you also use in your code, does not have this
restriction so it is better.
George
Choan C. Gálvez wrote:
>
> On 11/14/06, "Jörn Zaefferer" <[EMAIL PROTECTED]> wrote:
>> > If you have a jquery array of elements and need to call the
>> show("slow")
>> > method on each one in turn, how should you do it?
>> >
>> > For instance how might would you reveal each LI element in a list one
>> > after
>> > the other?
>> > Just applying the show() method reveals them all at once eg: $("#myList
>> > LI").show("slow") so that's not what I need.
>> >
>> > Using callbacks works for one or two items but does not adapt easily to
>> > many
>> > items. I saw a technique somewhere that used arguments.callee, can
>> anyone
>> > suggest how that might be used?
>>
>> My untested stab, with a callback:
>>
>> var jquery = $(/*select stuff*/),
>> position = 0;
>> var handler = function() {
>> if(position < jquey.length)
>> $(jquery[position++]).show("slow", handler);
>> };
>> handler();
>>
>> This doesn't look too bad, does it? I hope it helps.
>>
>> Not that I select the current DOM element via jquery[index] and wrap that
>> into a jQuery again. Using eq(index) would be more elegant, but kills my
>> original object, forcing me to use end().
>
> Wow. I was working in a quite verbose plugin. Merging our ideas, here it
> is:
>
> (function($) {
> $.extend($.fn, { orderedEffect: function(m, s, p, cb) {
> p === undefined && (p = 0);
> var col = $(this);
> var position = 0;
> var handler = function() {
> if (position < col.length) {
> setTimeout(function() {
>
> $(col[position++])[m](s, handler);
> }, position == 0 ? 0 : p);
> } else {
> typeof cb == "function" && cb();
> }
> };
> handler();
> return this;
> }});
> })(jQuery);
>
>
> Which can be called as
>
> $("selector").orderedEffect( effect, speed, pause, callback );
>
> For example:
>
> $("div").hide().orderedEffect("fadeIn", 500, 1000, function() {
> alert("done"); });
>
> * `effect` is the, er, effect that will be applied, passed as a String.
> * `speed` needs no explanation at all.
> * `pause` is the delay that between the end of an effect and the start
> of the next one. Optional.
> * `callback` is a function that will be called when all effects are
> finished.
>
> By the way, the method is chainable.
>
> I'll write a demo page tonight.
> --
> Choan
> <http://choangalvez.nom.es/>
> _______________________________________________
> jQuery mailing list
> [email protected]
> http://jquery.com/discuss/
>
>
--
View this message in context:
http://www.nabble.com/What-is-the-best-way-to-show%28%29-many-items-in-sequence%2C-one-after-the-other--tf2629186.html#a7338241
Sent from the JQuery mailing list archive at Nabble.com.
_______________________________________________
jQuery mailing list
[email protected]
http://jquery.com/discuss/
