在示例中（参见链接），四个按钮中的三个打开了一个灯箱。顺序如下：
- 用户点击
- 背景变黑
- 灯箱出现
- 灯箱内容淡入
每次用户点击链接时都会发生这种情况，即使他们之前已经打开过该灯箱。对于其中两个链接（右上角和左下角），它工作得很好，但对于另一个（左上角），它在用户第一次点击时工作正常，但在关闭灯箱并重新打开后，内容已经存在并出现从右侧“飞入”。灯箱的代码是相同的，除了 ID 标签。
为什么会这样？！！
查看的链接是：
http://testing.xenongroupadmin.com/whatis/pfi/#
Jquery代码是：
$(document).ready(function(){
$("a#show-whopanel").click(function(){
$("#lightbox").fadeIn(300, function(){
$("#who-panel").show(600, function(){
$("#animation1").fadeIn(1000)
});
});
});
$("a#close-panel1").click(function(){
$("#lightbox, #who-panel").fadeOut(300, function(){
$("div#animation1").hide(300);
}
);
});
});
$(document).ready(function(){
$("a#show-whatpanel").click(function(){
$("#lightbox").fadeIn(300, function(){
$("#what-panel").show(600, function(){
$("#animation2").fadeIn(1000)
});
});
});
$("a#close-pane2").click(function(){
$("#lightbox, #what-panel").fadeOut(300, function(){
$("div#animation2").hide(600);
}
);
});
});
$(document).ready(function(){
$("a#show-prosconspanel").click(function(){
$("#lightbox").fadeIn(300, function(){
$("#proscons-panel").show(600, function(){
$("#animation3").fadeIn(1000)
});
});
});
$("a#close-panel3").click(function(){
$("#lightbox, #proscons-panel").fadeOut(300, function(){
$("div#animation3").hide(600);
}
);
});
});