Add Spinner Download to JQuery UI Tab Body

Question

Is there an easy way to show the boot counter in the cube of the jquery user interface tab during boot through AJAX?

Essentially, I am looking for something like the spinner option, but display a graphical and boot message in the tab tag, not the tab header.

Answer 1

This should work with jQuery UI 1.9+ for tabs loaded by ajax (assuming your tabs have id tabs):

$("#tabs").tabs({ // loading spinner beforeLoad: function(event, ui) { ui.panel.html('<img src="loading.gif" width="24" height="24" style="vertical-align:middle;"> Loading...'); } }); 

You need to put load.gif in the right place and adjust the img tag src, width and height, but I think you get the idea. You can get a bunch of spinner images at http://www.ajaxload.info/