1

我想知道在显示以前不存在的 div 时的最佳做法是什么，然后在使用 Jquery 时将其删除。就像一个模态弹出框，如灯箱或排序......

我的页面上有一个弹出式购物车，它可以正常工作。最初我将购物车淡化为 0。但如果你这样做，下面的 html 将不可点击......所以现在我将购物车 div 向右移动了很远并淡化了它。然后，当您单击“购物车”按钮时，我将所有样式重新设置为正常。我想知道是否有更清洁的方法。说只是淡化一个div，然后禁用div，这样下面的html就可以点击了……因此你不必用一堆css来移动弹出的div。

这是我当前的代码：

document.getElementById("shopping-container").style.position="absolute";
document.getElementById("shopping-container").style.left="2000px";

$(".open").click(function() {
$("#shopping-container").stop().animate({"opacity": "1"}, "fast", function(){
    document.getElementById("shopping-container").style.position="relative";
    document.getElementById("shopping-container").style.top="150px";
 });
});

$(".close").click(function() {
$("#shopping-container").stop().animate({"opacity": "0"}, "fast", function(){
    document.getElementById("shopping-container").style.position="absolute";
    document.getElementById("shopping-container").style.left="2000px";
 });
});
4

2 回答 2

5

而不是离开屏幕，设置 style.display="none"

于 2012-11-19T05:52:14.257 回答
1

最初保持你的div隐藏......

<div id="shopping-container" style="display:none;">
......
Your elements here
......
</div>

$(".open").click(function() {
$("#shopping-container").stop().animate({"opacity": "1"}, "fast", function(){
    $("shopping-container").show();
 });
});


$(".close").click(function() {
$("#shopping-container").stop().animate({"opacity": "0"}, "fast", function(){
    $("shopping-container").hide();
 });
});
于 2012-11-19T06:00:13.710 回答