Сообщений в теме: 12

[P.K]

Hi

That works perfectly. Thanks Kess

 

One last thing can we put some kind of processing icon to show that tab is loading. 

thanks

[Kess]

Yes, of course.

 

First, get yourself an animated image. There are a lot of websites where you can get one. For example, http://preloaders.net/en/circular

 

For example, I've made a 32x32 icon with transparent background - http://kess.com.ua/preloader.gif

 

Put it in the images folder of your website. Then add the following line to the script before tab.load:

tab.html('<p style="text-align: center;"><img src="/images/preloader.gif" alt="" /></p>');

In my case it looks like this:

targeturl = currenturl + '?tmpl=component&jbquickview=loaded' + ' #' + tabid;
tab.html('<p style="text-align: center;"><img src="/images/preloader.gif" alt="" /></p>');
tab.load(targeturl);

[Kess]

Here is an updated code of that script which works a bit better:

<script type="text/javascript">
        var openedtabs = new Array();
        openedtabs[0] = true;
        openedtabs[4] = true;
        currenturl=document.URL;
        jQuery(function ($) {
            $('#<?php echo $tabsId;?>').JBZooTabs({
                onTabShow: function (index) {
                    var map = $('.googlemaps > div:first');
                    if (map.length) {
                        map.data('Googlemaps').refresh();
                    }
                    if (openedtabs[index] != true) {                        
                        var tab = $('#<?php echo $tabsId;?> > div').eq(index);
                        var tabid = tab.attr('id');
                        targeturl = currenturl + '?tmpl=component&jbquickview=loaded' + ' #' + tabid;
                        tab.html('<p style="text-align: center;"><img src="/images/templ/362.gif" alt="" /></p>');
                        tab.load(targeturl, function() {
                            var JTooltips = new Tips($$('.hasTip'), {maxTitleChars: 50, fixed: false});
                            openedtabs[index] = true;
                        });                                                
                    }
                }
            });
        });
    </script>

Only ".load" function has changed.

 
If the content of some tab requires initialization scripts, such scripts should be inserted within this function:

 

tab.load(targeturl, function() {
    var JTooltips = new Tips($$('.hasTip'), {maxTitleChars: 50, fixed: false});
    openedtabs[index] = true;
}); 

In this example "JTooltips" makes Joomla tooltips work and "openedtabs" prevents this tab from being reloaded again.

Сообщение отредактировал Kess: 28 December 2013 - 19:35