如何解决如何显示每次点击和内容之前的负载
| 我有四个链接菜单(主页|关于|解决方案|联系人),每次单击{Flesler's scrollTo代码:http://demos.flesler.com/jquery/serialScroll/}都使用jquery滚动技术,并带有{TKYK历史记录插件http://tkyk.github.com/jquery-history-plugin/}。好的,我的情况是,当我单击第二个链接“关于”时,它首先显示主页,而不是setTimeout(),然后显示正确的内容。无论如何,有没有隐藏以前的内容并显示某种类型的“加载”,然后显示新内容? 这是我的init.js代码: 函数resize(){ var wdt = 1000; var hgt = 500; 宽度= $(window).wdt; 高度= $(窗口).hgt; mask_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(){ //滚动x轴内容 $(\'a.panel \')。click(function(){ $(\'a.panel \')。removeClass(\'selected \'); $(this).addClass(\'selected \'); 当前= $(this); $(\'#container \')。scrollTo($(this).attr(\'href \'),1000,{缓动:\'easeInOutCubic \',队列:true,持续时间:1500,轴:\'xy \'}); 返回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;
});
});
解决方法
我确实没有遇到问题,但是我认为这会帮助您:
$(\'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。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。