amircx schrieb:
> hey... i want to load content inside tab, and whille that to show "loading"
> image... i saw the api and i dont success to do it
> what i did worng in here?
I don't know where you got that from, but there is no "spinner" option
currently implemented.
$('#container-10').tabs({ remote: true, fxFade: true, fxSpeed: 'fast',
fxSlide: true, loadingClass: 'progress', spinner: '/myhome/img/load1.gif'});
The loading class is attached to the the <li> element which anchor got
clicked on to load the Ajax content. This class is used to change the
appearance of the clicked tab while loading.
It's default value is 'tabs-loading', thus there's the following rule in
the style sheet:
.anchors .tabs-selected .tabs-loading {
padding-left: 25px;
background-image: url(loading.gif); /* <= change url here?! */
background-position: 4px 50%;
background-repeat: no-repeat;
}
If you want to change the name of that class, you can use the
loadingClass option for that. You have to adapt your style sheet
accordingly of course:
.anchors .tabs-selected .progress {
padding-left: 25px;
background-image: url(loading.gif);
background-position: 4px 50%;
background-repeat: no-repeat;
}
The little spinner will be shown left to the text of the tab title.
Showing a spinner elsewhere is not supported by an option, but you could
use the onClick and onHide callbacks, the former for displaying the
spinner, the latter to hide it. onHide gets fired when the formerly
active tab is hidden, e.g. in the middle of the effect, right before the
new tab is revealed. Something like that:
$('#container').tabs({
remote: true,
fxFade: true,
fxSlide: true,
fxSpeed: 'fast',
onClick: function() {
$('#progress').show();
},
onHide: function() {
$('#progress').hide();
}
});
Let me know if that works for you. onHide does not exactly map to the
point when the content got loaded. As an alternative you could use the
global ajaxStart and ajaxStop handlers for that.
$("#progress")
.ajaxStart(function(){
$(this).show();
})
.ajaxStop(function(){
$(this).hide();
});
-- Klaus
_______________________________________________
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
