<div>图层停止图像幻灯片</div>

时间:2013-07-04 15:41:41

标签: jquery

我有以下代码可以正常工作但是当页面加载时,图像幻灯片停止。如果我删除代码,幻灯片显示会重新启动。请告诉我哪里出错了。

<div id="darken" class="darkenB"></div>
<div id="popup_box">
    <div id="container">Airport Notam</div>
    <h1><div align="left"></div></h1>
    <a id="popupBoxClose">Close Notam</a>   
</div>

样式:

<style type="text/css">

#popup_box {
    display:none; 
    position:fixed;  
    _position:absolute;   
    width:700px; 
    overflow:auto; 
    background:#FFFFFF;
    z-index: 100;
    border:5px solid #ff0000;      
    padding:15px;  
    font-size:8px;  
    border-radius:25px;
}

#container {
    width:100%;
    height:100%;
    background: #ff0000;
    color: #ffffff;
    font-size: 15px;
    text-align:center;
}

a{ cursor: pointer; text-decoration:none; }

#popupBoxClose {
    font-size:10px;  
    line-height:15px;  
    right:20px;  
    bottom:5px;  
    position:absolute;  
    color:#ff0000;  
    font-weight:500;      
}

.darkenB {
    display:none;
    background-color: rgb(0, 0, 0);
    opacity: 0.7; /* Safari, Opera */
    -moz-opacity:0.70: /* FireFox */
    filter: alpha(opacity=70); /* IE */
    z-index: 99;
    height: 100%;
    width: 100%;
    background-repeat:repeat;
    position:fixed;
    top: 0px;
    left: 0px;
}
</style>    

jQuery的:     

$(document).ready( function() {

    // When site loaded, load the Popupbox First
    loadPopupBox();

    $('#popupBoxClose').click( function() {           
        unloadPopupBox();

    });

    $('#container').click( function() {
        unloadPopupBox();
    });

    function unloadPopupBox() {    // TO Unload the Popupbox
        $('#popup_box').fadeOut("slow");
        $('#darken').fadeOut("slow");
        $('#container').css({ // this is just for style       
            "opacity": "0.3" 
        });
    }   

    function loadPopupBox() {    // To Load the Popupbox
        $('#darken').fadeIn("slow");
        $('#popup_box').fadeIn("slow");
        $('#popup_box').center();
        $('#container').css({ // this is just for style
            "opacity": "1" 
        });        
    }       
});

jQuery.fn.center = function () {

    this.css("top", Math.max(0, (($(window).height() - $(this).outerHeight()) / 2) +   $(window).scrollTop()) + "px");
    this.css("left", Math.max(0, (($(window).width() - $(this).outerWidth()) / 2) + $(window).scrollLeft()) + "px");
    return this;
}  

</script>

0 个答案:

没有答案