我想打开一个div,将页面加载到该div,然后将其关闭。
我想通过多个链接来做到这一点。
<div id="main-nav">
<div id="menu-container">
<div id="menu">
<ul>
<li><a href="home.html"></a></li>
<li id="clicklink"><a href="#">mission</a></li>
<li><a href="#">leadership</a></li>
<li><a href="#">awards</a></li>
<li><a href="#">sustainability</a></li>
<li><a href="#">faq</a></li>
</ul>
</div>
<div id="clickme3">
<img src="images/logo-sm.png">
</div>
</div>
<div id="content-load">
</div>
</div>
$("#clicklink").toggle(function () {
$("#main-nav").animate({
height: "300",
}, 1000, function () {
$("#content-load").load("contentpage.html", function () {
})
function () {
$("#main-nav").animate({
height: "40",
}, 1000, )
};
});
});
这就是我所无法使用的。
我可以使它正常工作,但是当然不会切换。
$("#clicklink").click(function () {
$("#main-nav").animate({
height: "300",
}, 1000, function () {
$("#content-load").load("contentpage.html", function () {
})
});
});
我是jQuery的新手,但渴望学习。有没有办法让我切换?
You can view production here http://billygoforth/learning/CMD
您会看到它向上移动了底部导航(这是我想要的)并在下面加载了外部页面内容(也是我想要的),但是我想要它,因此如果再次单击链接,它会折叠,然后我可以将此jquery放在其他链接ID上。
再次非常感谢!
最佳答案
尝试这种方式:
// global variable
var toggleHeight = $('#main-nav').height();
$("#clicklink").click(function () {
if(toggleHeight <= 0){
$("#main-nav").animate({
height: "300px",
}, 1000, function () {
$("#content-load").load("contentpage.html");
});
}
else{
$("#main-nav").animate({
height: "0px",
}, 1000, function () { });
}
});