我从http://themeforest.net购买了一个主题,现在它们被取消了。
原始主题功能是在索引页面中将所有链接页面放在他们自己的div中,但是我改变了功能,以便每个链接都在自己的控制器上,因为我使用的是Codeigniter。
我想要发生的是当点击一个新链接时,它仍然会卷起内容div并转到点击的链接,然后滚动该页面的内容。截至目前,它一直向上卷起页面,甚至没有加载新页面。注释的代码部分是原始代码来自模板的内容。
/*****************************************************
MENU TRANSITION EFFECTS
******************************************************/
$("#menu1 ul li a").click(function(e){
e.preventDefault();
$('#container').animate({top:'-500px'},500,'easeInQuart');
/*
var id = $(this).attr("href");
if(id == aid) return false;
$('#menu1 ul li a').removeClass('a');
$(this).addClass('a');
if($("#container > div:visible").size() > 0) {
$("#container > div:visible").animate({top:'-500px'},500,'easeInQuart',function(){ $("#container > div:visible").css({display:'none',top:'-500px'}); $('#container > div#' + id).css({display:'block'}).delay(400).animate({top:'500px'},800,'easeOutQuart');
$(function() {
$('.scroll').jScrollPane();
});
});
} else {
$('#container > div#' + id).css({display:'block'}).animate({top:'500px'},200,'easeOutQuart');
}
aid = id;
return false;
*/
});
编辑:我在我的常规网站上试过它,由于某种原因,它的工作原理不一样。这是模板。我将其上传到我的其他网站进行展示。请记住,不同之处在于每个链接都是一个新控制器,每个div都是一个新视图。这是否进一步解释了原始模板与我想要完成的内容之间的差异。
有人有什么想法吗?
答案 0 :(得分:0)
“过渡”javascript代码可能如下所示:
$("#menu1 ul li a").click(function(e){
var a = this;
e.preventDefault();
$('#container').animate({top:'-500px'},500,'easeInQuart',function() {
location.href = a.href;
});
});
文档就绪代码:
$(document).ready(function() {
$('#container').animate({top:'0px'},500,'easeInQuart');
});
/*CSS*/
#container { top: -500px; }