Re: [jQuery] Ajax Throbber How-to?
Hey Andy,
Here ya go. Its basically the same thing that John sent me:
$(document).ready(function() {
$('<div id="throbber"><img src="indicator.gif" alt=""></div>')
.hide()
.ajaxStart(function(){
$(this).show();
})
.ajaxStop(function(){
$(this).hide();
})
.appendTo("#rating");
var container = $("#rating");
container.find("a").click( function(e) {
e.preventDefault();
$.ajax({ type: "GET",
url: "test.cfm",
dataType: "xml",
success: function(msg){ alert( $( "MyText",
msg ).text() ); }
});
} );
});
Rey...
Andy Matthews wrote:
> Rey...
>
> Do you have an example?
>
>
> andy matthews
> web developer
> certified advanced coldfusion programmer
> ICGLink, Inc.
> [EMAIL PROTECTED]
> 615.370.1530 x737
> --//->
>
> -Original Message-
> *From:* [EMAIL PROTECTED]
> [mailto:[EMAIL PROTECTED] Behalf Of *Rey Bango
> *Sent:* Saturday, September 09, 2006 11:07 PM
> *To:* jQuery Discussion.
> *Subject:* Re: [jQuery] Ajax Throbber How-to?
>
> Man, that is REALLY powerful John. I added a .hide() method like this:
>
> $("#throbber").hide()
> .ajaxStart(function(){
> $(this).show();
> })
> .ajaxStop(function(){
> $(this).hide();
> });
>
> and then added my div like this:
>
> alt="" border="0" />
>
> and it worked like a charm!
>
> Thanks for your help and patience John.
>
> Rey...
>
> John Resig wrote:
>
>>$("#throbber")
>>.ajaxStart(function(){
>>$(this).show();
>>})
>>.ajaxStop(function(){
>>$(this).hide();
>> });
>>
>>jQuery's system is more dynamic than just hiding/showing a single
>>element, as you can see. Let me know if this helps you at all.
>>
>>--John
>>
>>
>>
>>>I've seen some Ajax libraries that have an Ajax throbber/indicator
>>>function built in which allows you to specify an indicator during the
>>>Ajax call.
>>>
>>>Does JQuery have something like this? If not, whats everyone doing to
>>>display one? Any plugins for this?
>>>
>>
>>
>>___
>>jQuery mailing list
>>discuss@jquery.com
>>http://jquery.com/discuss/
>>
>>
>
>
>
>
> ___
> jQuery mailing list
> discuss@jquery.com
> http://jquery.com/discuss/
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
Re: [jQuery] Ajax Throbber How-to?
Felix...
When
was the last time you disabled _javascript_?
-Original Message-From: [EMAIL PROTECTED]
[mailto:[EMAIL PROTECTED]On Behalf Of Felix
GeisendörferSent: Sunday, September 10, 2006 5:17 AMTo:
jQuery Discussion.Subject: Re: [jQuery] Ajax Throbber
How-to?One thing I really hate about AJAX, is that
everybody put's those semantically meaningless activity indicators in their
html layout. When you disable css you end up with a mess of animated gif's
which is really annoying. I don't blame you, but it's a very nice move towards
accessibility and usability to add those div's/images/etc. with _javascript_ to
your DOM instead of having them there already and just hiding them with
CSS.Best Regards,Felix Geisendörfer
--http://www.thinkingphp.orghttp://www.fg-webdesign.de
Rey Bango schrieb:
Man, that is
REALLY powerful John. I added a .hide() method like
this:$("#throbber").hide()
.ajaxStart(function(){
$(this).show();
})
.ajaxStop(function(){
$(this).hide();
});and then added my div like this:and it worked like a
charm!Thanks for your help and patience
John.Rey...John Resig wrote:
$("#throbber")
.ajaxStart(function(){
$(this).show();
})
.ajaxStop(function(){
$(this).hide();
});
jQuery's system is more dynamic than just hiding/showing a single
element, as you can see. Let me know if this helps you at all.
--John
I've seen some Ajax libraries that have an Ajax throbber/indicator
function built in which allows you to specify an indicator during the
Ajax call.
Does JQuery have something like this? If not, whats everyone doing to
display one? Any plugins for this?
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
Re: [jQuery] Ajax Throbber How-to?
Rey...
Do you
have an example?
-Original Message-From: [EMAIL PROTECTED]
[mailto:[EMAIL PROTECTED]On Behalf Of Rey
BangoSent: Saturday, September 09, 2006 11:07 PMTo:
jQuery Discussion.Subject: Re: [jQuery] Ajax Throbber
How-to?Man, that is REALLY powerful John. I added a
.hide() method like this:$("#throbber").hide()
.ajaxStart(function(){
$(this).show();
})
.ajaxStop(function(){
$(this).hide(); });and
then added my div like this:and it worked like a charm!Thanks for your
help and patience John.Rey...John Resig wrote:
$("#throbber")
.ajaxStart(function(){
$(this).show();
})
.ajaxStop(function(){
$(this).hide();
});
jQuery's system is more dynamic than just hiding/showing a single
element, as you can see. Let me know if this helps you at all.
--John
I've seen some Ajax libraries that have an Ajax throbber/indicator
function built in which allows you to specify an indicator during the
Ajax call.
Does JQuery have something like this? If not, whats everyone doing to
display one? Any plugins for this?
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
Re: [jQuery] Ajax Throbber How-to?
That is just too awesome. Damn I love JQuery!
Rey
John Resig wrote:
From what I've seen, JQuery has great methods for inclusion of elements so
either situation seems relatively easy to handle but I'm curious as to how
many sites that have taken the full CSS plunge are accommodating for this.
That's true - to add in your div dynamically, you can do:
$('')
.hide()
.ajaxStart(function(){
$(this).show();
})
.ajaxStop(function(){
$(this).hide();
})
.appendTo("#someContainer");
That way it's "more semantic" - or "less non-semantic", however you
wanna look at it.
--John
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
Re: [jQuery] Ajax Throbber How-to?
John Resig schrieb:
>> From what I've seen, JQuery has great methods for inclusion of elements so
>> either situation seems relatively easy to handle but I'm curious as to how
>> many sites that have taken the full CSS plunge are accommodating for this.
>
> That's true - to add in your div dynamically, you can do:
>
> $('')
> .hide()
> .ajaxStart(function(){
> $(this).show();
> })
> .ajaxStop(function(){
> $(this).hide();
> })
> .appendTo("#someContainer");
>
> That way it's "more semantic" - or "less non-semantic", however you
> wanna look at it.
>
> --John
haha, to top it all you could just throw in something like:
Loading…
and show the icon via some image replacement technique...
-- klaus
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
Re: [jQuery] Ajax Throbber How-to?
> From what I've seen, JQuery has great methods for inclusion of elements so
> either situation seems relatively easy to handle but I'm curious as to how
> many sites that have taken the full CSS plunge are accommodating for this.
That's true - to add in your div dynamically, you can do:
$('')
.hide()
.ajaxStart(function(){
$(this).show();
})
.ajaxStop(function(){
$(this).hide();
})
.appendTo("#someContainer");
That way it's "more semantic" - or "less non-semantic", however you
wanna look at it.
--John
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
Re: [jQuery] Ajax Throbber How-to?
I definitely mean the div & the image. Because divitus is a really
terrible problem with modern sites as well, so every div you can remove
you should try to get rid of ; ).
but I'm curious as
to how many sites that have taken the full CSS plunge are accommodating
for this.
Not a lot. I am a fanatic about turning of CSS on sites I visit (Ctrl +
Shift + S if you use firefox' web developer extension) and most of the
stuff that calls itself "web 2.0" is terrible when it comes to
accessibility. However, for my own projects I try really hard to keep
everything as semantic & accessible as possible.
Best Regards,
Felix Geisendörfer
--
http://www.thinkingphp.org
http://www.fg-webdesign.de
Rey Bango schrieb:
LOL. Thanks Felix. What I was trying to determine in my last reply was
if you were referring to both the DIV & the image or simply the
image in terms of dynamic inclusion.
>From what I've seen, JQuery has great methods for inclusion of
elements
so either situation seems relatively easy to handle but I'm curious as
to how many sites that have taken the full CSS plunge are accommodating
for this.
Rey...
Felix Geisendörfer wrote:
>From a semantic/accessibility point of view you would ideally add
and
remove the activity indicators to/from the DOM when they are needed.
However if there are parts of your application were accessibility is
not much of a concern like the back end, I think it's excusable to go
for the quick & dirty way ; ).
Best Regards,
Felix Geisendörfer
--
http://www.thinkingphp.org
http://www.fg-webdesign.de
Rey Bango schrieb:
Thanks for the heads up Felix. I really understand your point.
Would it make sense then to drop in a div into the html layout and then
dynamically add the the image as needed or do you suggest doing both on
the fly?
Rey...
Felix Geisendörfer wrote:
One thing I really hate about AJAX, is that everybody put's those
semantically meaningless activity indicators in their html layout. When
you disable css you end up with a mess of animated gif's which is
really annoying. I don't blame you, but it's a very nice move towards
accessibility and usability to add those div's/images/etc. with
_javascript_ to your DOM instead of having them there already and just
hiding them with CSS.
Best Regards,
Felix Geisendörfer
--
http://www.thinkingphp.org
http://www.fg-webdesign.de
Rey Bango schrieb:
Man, that is REALLY powerful John. I added a .hide() method like this:
$("#throbber").hide()
.ajaxStart(function(){
$(this).show();
})
.ajaxStop(function(){
$(this).hide();
});
and then added my div like this:
and it worked like a charm!
Thanks for your help and patience John.
Rey...
John Resig wrote:
$("#throbber")
.ajaxStart(function(){
$(this).show();
})
.ajaxStop(function(){
$(this).hide();
});
jQuery's system is more dynamic than just hiding/showing a single
element, as you can see. Let me know if this helps you at all.
--John
I've seen some Ajax libraries that have an Ajax throbber/indicator
function built in which allows you to specify an indicator during the
Ajax call.
Does JQuery have something like this? If not, whats everyone doing to
display one? Any plugins for this?
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
Re: [jQuery] Ajax Throbber How-to?
LOL. Thanks Felix. What I was trying to determine in my last reply was
if you were referring to both the DIV & the image or simply the
image in terms of dynamic inclusion.
>From what I've seen, JQuery has great methods for inclusion of elements
so either situation seems relatively easy to handle but I'm curious as
to how many sites that have taken the full CSS plunge are accommodating
for this.
Rey...
Felix Geisendörfer wrote:
>From a semantic/accessibility point of view you would ideally add
and
remove the activity indicators to/from the DOM when they are needed.
However if there are parts of your application were accessibility is
not much of a concern like the back end, I think it's excusable to go
for the quick & dirty way ; ).
Best Regards,
Felix Geisendörfer
--
http://www.thinkingphp.org
http://www.fg-webdesign.de
Rey Bango schrieb:
Thanks for the heads up Felix. I really understand your point.
Would it make sense then to drop in a div into the html layout and then
dynamically add the the image as needed or do you suggest doing both on
the fly?
Rey...
Felix Geisendörfer wrote:
One thing I really hate about AJAX, is that everybody put's those
semantically meaningless activity indicators in their html layout. When
you disable css you end up with a mess of animated gif's which is
really annoying. I don't blame you, but it's a very nice move towards
accessibility and usability to add those div's/images/etc. with
_javascript_ to your DOM instead of having them there already and just
hiding them with CSS.
Best Regards,
Felix Geisendörfer
--
http://www.thinkingphp.org
http://www.fg-webdesign.de
Rey Bango schrieb:
Man, that is REALLY powerful John. I added a .hide() method like this:
$("#throbber").hide()
.ajaxStart(function(){
$(this).show();
})
.ajaxStop(function(){
$(this).hide();
});
and then added my div like this:
and it worked like a charm!
Thanks for your help and patience John.
Rey...
John Resig wrote:
$("#throbber")
.ajaxStart(function(){
$(this).show();
})
.ajaxStop(function(){
$(this).hide();
});
jQuery's system is more dynamic than just hiding/showing a single
element, as you can see. Let me know if this helps you at all.
--John
I've seen some Ajax libraries that have an Ajax throbber/indicator
function built in which allows you to specify an indicator during the
Ajax call.
Does JQuery have something like this? If not, whats everyone doing to
display one? Any plugins for this?
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
Re: [jQuery] Ajax Throbber How-to?
>From a semantic/accessibility point of view you would ideally add and
remove the activity indicators to/from the DOM when they are needed.
However if there are parts of your application were accessibility is
not much of a concern like the back end, I think it's excusable to go
for the quick & dirty way ; ).
Best Regards,
Felix Geisendörfer
--
http://www.thinkingphp.org
http://www.fg-webdesign.de
Rey Bango schrieb:
Thanks for the heads up Felix. I really understand your point.
Would it make sense then to drop in a div into the html layout and then
dynamically add the the image as needed or do you suggest doing both on
the fly?
Rey...
Felix Geisendörfer wrote:
One thing I really hate about AJAX, is that everybody put's those
semantically meaningless activity indicators in their html layout. When
you disable css you end up with a mess of animated gif's which is
really annoying. I don't blame you, but it's a very nice move towards
accessibility and usability to add those div's/images/etc. with
_javascript_ to your DOM instead of having them there already and just
hiding them with CSS.
Best Regards,
Felix Geisendörfer
--
http://www.thinkingphp.org
http://www.fg-webdesign.de
Rey Bango schrieb:
Man, that is REALLY powerful John. I added a .hide() method like this:
$("#throbber").hide()
.ajaxStart(function(){
$(this).show();
})
.ajaxStop(function(){
$(this).hide();
});
and then added my div like this:
and it worked like a charm!
Thanks for your help and patience John.
Rey...
John Resig wrote:
$("#throbber")
.ajaxStart(function(){
$(this).show();
})
.ajaxStop(function(){
$(this).hide();
});
jQuery's system is more dynamic than just hiding/showing a single
element, as you can see. Let me know if this helps you at all.
--John
I've seen some Ajax libraries that have an Ajax throbber/indicator
function built in which allows you to specify an indicator during the
Ajax call.
Does JQuery have something like this? If not, whats everyone doing to
display one? Any plugins for this?
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
Re: [jQuery] Ajax Throbber How-to?
Thanks for the heads up Felix. I really understand your point.
Would it make sense then to drop in a div into the html layout and then
dynamically add the the image as needed or do you suggest doing both on
the fly?
Rey...
Felix Geisendörfer wrote:
One thing I really hate about AJAX, is that everybody put's those
semantically meaningless activity indicators in their html layout. When
you disable css you end up with a mess of animated gif's which is
really annoying. I don't blame you, but it's a very nice move towards
accessibility and usability to add those div's/images/etc. with
_javascript_ to your DOM instead of having them there already and just
hiding them with CSS.
Best Regards,
Felix Geisendörfer
--
http://www.thinkingphp.org
http://www.fg-webdesign.de
Rey Bango schrieb:
Man, that is REALLY powerful John. I added a .hide() method like this:
$("#throbber").hide()
.ajaxStart(function(){
$(this).show();
})
.ajaxStop(function(){
$(this).hide();
});
and then added my div like this:
and it worked like a charm!
Thanks for your help and patience John.
Rey...
John Resig wrote:
$("#throbber")
.ajaxStart(function(){
$(this).show();
})
.ajaxStop(function(){
$(this).hide();
});
jQuery's system is more dynamic than just hiding/showing a single
element, as you can see. Let me know if this helps you at all.
--John
I've seen some Ajax libraries that have an Ajax throbber/indicator
function built in which allows you to specify an indicator during the
Ajax call.
Does JQuery have something like this? If not, whats everyone doing to
display one? Any plugins for this?
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
Re: [jQuery] Ajax Throbber How-to?
One thing I really hate about AJAX, is that everybody put's those
semantically meaningless activity indicators in their html layout. When
you disable css you end up with a mess of animated gif's which is
really annoying. I don't blame you, but it's a very nice move towards
accessibility and usability to add those div's/images/etc. with
_javascript_ to your DOM instead of having them there already and just
hiding them with CSS.
Best Regards,
Felix Geisendörfer
--
http://www.thinkingphp.org
http://www.fg-webdesign.de
Rey Bango schrieb:
Man, that is REALLY powerful John. I added a .hide() method like this:
$("#throbber").hide()
.ajaxStart(function(){
$(this).show();
})
.ajaxStop(function(){
$(this).hide();
});
and then added my div like this:
and it worked like a charm!
Thanks for your help and patience John.
Rey...
John Resig wrote:
$("#throbber")
.ajaxStart(function(){
$(this).show();
})
.ajaxStop(function(){
$(this).hide();
});
jQuery's system is more dynamic than just hiding/showing a single
element, as you can see. Let me know if this helps you at all.
--John
I've seen some Ajax libraries that have an Ajax throbber/indicator
function built in which allows you to specify an indicator during the
Ajax call.
Does JQuery have something like this? If not, whats everyone doing to
display one? Any plugins for this?
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
Re: [jQuery] Ajax Throbber How-to?
Man, that is REALLY powerful John. I added a .hide() method like this:
$("#throbber").hide()
.ajaxStart(function(){
$(this).show();
})
.ajaxStop(function(){
$(this).hide();
});
and then added my div like this:
and it worked like a charm!
Thanks for your help and patience John.
Rey...
John Resig wrote:
$("#throbber")
.ajaxStart(function(){
$(this).show();
})
.ajaxStop(function(){
$(this).hide();
});
jQuery's system is more dynamic than just hiding/showing a single
element, as you can see. Let me know if this helps you at all.
--John
I've seen some Ajax libraries that have an Ajax throbber/indicator
function built in which allows you to specify an indicator during the
Ajax call.
Does JQuery have something like this? If not, whats everyone doing to
display one? Any plugins for this?
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
Re: [jQuery] Ajax Throbber How-to?
$("#throbber")
.ajaxStart(function(){
$(this).show();
})
.ajaxStop(function(){
$(this).hide();
});
jQuery's system is more dynamic than just hiding/showing a single
element, as you can see. Let me know if this helps you at all.
--John
> I've seen some Ajax libraries that have an Ajax throbber/indicator
> function built in which allows you to specify an indicator during the
> Ajax call.
>
> Does JQuery have something like this? If not, whats everyone doing to
> display one? Any plugins for this?
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
[jQuery] Ajax Throbber How-to?
I've seen some Ajax libraries that have an Ajax throbber/indicator function built in which allows you to specify an indicator during the Ajax call. Does JQuery have something like this? If not, whats everyone doing to display one? Any plugins for this? Thanks, Rey... ___ jQuery mailing list discuss@jquery.com http://jquery.com/discuss/
