CODEWITHSUNDEEP
jqueryjquery-ui
user1264362
user1264362

Reputation: 69

how to make a delay between jquery tabs

In my code I have a jquery tab and when clicked a tab I am printing the text "Loading". However since the tabs are changing too fast I couldnt see the text. How can I make a delay of 1 or 2 seconds when switching bettween tabs? thanks.

My codes are below.

<div class="loading"><p>Loading...</p></div>

$(function() {
    $(".nav-content").tabs(
        {
        // CSS classes                      
        selectedClass: 'current',
        spinner: '',
        select: function(ui) {

           $(".loading").show();                

        },
        show: function(ui) {

            $(".loading").hide();

        }
    }
);

});

Upvotes: 0

Views: 393

Answers (2)

David Houde
David Houde

Reputation: 4778

You can delay it with .delay() but this seems somewhat backwards. I know everything must be AJAX these days, but do we really need artificial loading time? I think if your site is ready to render the UI faster than the Loading... message, then let it. Makes for a better user experience, even if it doesn't seem as complicated

Upvotes: 2

Claudio Redi
Claudio Redi

Reputation: 68400

If tabs are changing fast enough to make your loading message invisible I'd say the smarter desicion would be removing the loading message since seems useless.

Unless you have a very specific reason to make the "loading" message visible, don't see the point to degrade the user experience with an artificial delay.

Upvotes: 2

Related Questions