2012-10-18 110 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; 
}