2012-10-18 149 views
0

http://jsfiddle.net/nVZEB/6/jQuery的弹出页面加载

弹出应在此

testingPopup

的点击来显示,但我看到这个页面加载这个问题本身.... 如何隐藏这个,它应该显示在弹出只有

$(function() { 

var popup = false; 

$(".open").click(function(){ 
    alert(123); 
    if(popup === false){ 
     $("#overlayEffect").fadeIn("slow"); 
     $(this).parent().find('.popupContainer').fadeIn("slow"); 
     $(this).parent().find('.close').fadeIn("slow"); 
     center(); 
     popup = true; 
    }  
    }); 

    $(".close").click(function(){ 
     hidePopup(); 
    }); 

    $(".overlayEffect").click(function(){ 
     hidePopup(); 
    }); 

function center(){ 
    var windowWidth = document.documentElement.clientWidth; 
    var windowHeight = document.documentElement.clientHeight; 
    var popupHeight = $(".popupContainer").height(); 
    var popupWidth = $(".popupContainer").width(); 
    $(".popupContainer").css({ 
     "position": "absolute", 
     "top": 85, 
     "left": windowWidth/2-popupWidth/2 
    }); 

    } 
function hidePopup(){ 
    if(popup===true){ 
     $(".overlayEffect").fadeOut("slow"); 
     $(".popupContainer").fadeOut("slow"); 
     $(".close").fadeOut("slow"); 
     popup = false; 
    } 
} 

} ,jQuery); 

回答

2

看起来你在popupContainer div上有hidden类,但是你没有任何样式。

尝试添加以下内容到风格:

.hidden { 
    display: none; 
}