Question

我有一个四链接菜单（主页| about | solutions | contact）使用jquery滚动技术，每次点击{Flesler的scrollTo代码：http://demos.flesler.com/jquery/serialScroll/}和{TKYK历史插件http://tkyk.github.com/jquery-history-plugin/}。好吧，我的情况是，当我点击第二个链接“关于”它首先显示home而不是setTimeout（）以后它显示正确的内容。反正有没有隐藏以前的内容并显示某种类型的“加载”，然后显示新的内容？

这是我的init.js代码：

function resize() {
         var wdt = 1000;
             var hgt = 500;
         width   = $(window).wdt;
         height  = $(window).hgt;
         mask_width = width * $('.item').length;
         $('#debug').html(width  + ' ' + height + ' ' + mask_width);
         $('#container,.item').css({width: width, height: height});
         $('#mask').css({width: mask_width, height: height});
         $('#container').scrollTo($('a.selected').attr('href'),0);
}

$(document).ready(function() {
            // scroll x-axis content
            $('a.panel').click(function() {
                $('a.panel').removeClass('selected');
                $(this).addClass('selected');
                current = $(this);
                $('#container').scrollTo($(this).attr('href'),1000,{ easing:'easeInOutCubic',queue:true,duration:1500,axis:'xy' });
                         return false;

        });
        $(window).resize(function() { resize(); });


    // hash history
    function load(num) { $('.content').load(num); }
                 $.history.init(function(url) { load(url == "" ? "home" : url); });
                 $("a[rel='history']").click(function(e) {
                 var url = $(this).attr('href');
                 url = url.replace(/^.*#/,"!/");
         setTimeout(function() {
                 $.history.load(url);
             },1000);
                 return false;
        });

}）;

Answer 1

我没有遇到问题，但我认为这会对你有所帮助：

$('a.panel').click(function() {
    $('a.panel').removeClass('selected');
    $(this).addClass('selected');
    $('a.panel').not($(this)).each(function() {
        $($(this).attr("href")).hide();
    });
    // show your loading here
    current = $(this);
    $(current.attr("href")).show()
    $('#container').scrollTo($(this).attr('href'),1000,{ easing:'easeInOutCubic',queue:true,duration:1500,axis:'xy', onAfter: function() { //hide your loading here } });
    return false;
});

这包括隐藏菜单上链接的所有容器，显示加载，显示您要显示的容器，然后隐藏加载。

编辑：

也许你甚至不需要加载...只需从scrollTo选项中删除onAfter。

如何在每次点击和内容时首先显示负载

1 个答案: