Question

这是我正在寻找的完整代码。

第一个黑屏将会出现，之后该徽标加载了fadein效果。 2秒后，完整的div将消失。

<script type="text/javascript">
$(document).ready(function() {  
     $('#splash-logo').hide()
        .load(function () {
             $('#splash-logo').fadeIn(2000, function() {
                   $('#splash').fadeOut(1000);  
              });
        });
});
</script>


<style type="text/css">
#splash{
    background:#000;
    width:100%;
    height:100%;
    position:absolute;
    z-index:9999;
    text-align:center;
    padding-top:98px;
}
body{
    margin:0;
}
</style>


<div id="splash">
<img src="" id="#splash-logo" />
</div>

Answer 1

加载window时，尚未加载您正在使用的元素。它们仅在DOM完全加载后才可用。

因此，请更改要应用于load对象的初始document方法，而不是window对象：

$(document).ready(function() {    
    $('#splash-logo').hide()
        .load(function () {
            $('#splash-logo').fadeIn(2000, function() {
                $('#splash').fadeOut(1000);  
            });
        });
});

Answer 2

将window更改为document

$(document).ready(function() {    
 $('#splash-logo').hide()
    .load(function () {
         $('#splash-logo').fadeIn(2000, function() {
                $('#splash').fadeOut(1000);  
            });
        });
});

如果您想使用window，则必须使用JQuery load函数而不是ready

$(window).load(function () {
  // run code
});

IE9 jquery加载功能问题

2 个答案: