0

我目前正试图让这个启动页面淡入，然后淡出。然而，它只是淡出，而不是淡入。

这是代码：

    <script type="text/javascript">
    $(document).ready(function(){
$('.all').hide(); 
$('#surprisesplash').fadeIn(1500)
});
$(function(){
   setTimeout(function() {
     $('#surprisesplash').fadeOut(1000, function() {
     $('.all').fadeIn();
  });
 }, 3000);
});
</script>

这是网站。

我对此很陌生，并且仍在掌握之中。任何有关语法或任何类似的帮助也将不胜感激。

汤姆：）

这是CSS

#surprisesplash {

    width:850px;
    height:621px;
    left:50%;
    top:50%;
    margin-top:-310.5px;
    margin-left:-425px;
    position:fixed;

    }

.all {
    display:none;

    }

html:

  <div id="surprisesplash"><img src="/surprise2.png"></div>

    <div class ="all">

    <div id = "header">
        <div id = "music">Camelot</div>         
        <div id = "about"><a href="#">About</a></div>
        <div id = "contact"><a href="#">Contact</a></div>
        </div>
        <div id = "musicinfo">

        <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. 
        Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. 
        Donec eu libero sit amet quam egestas semper. 
        Aenean ultricies mi vitae est. 
        Mauris placerat eleifend leo.</p></div>

        <div id = "aboutinfo">
        <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. 
        Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. 
        Donec eu libero sit amet quam egestas semper. </p></div>

            <div id = "contactinfo">
        <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. 
        Vestibulum tortor quam, feugiat vitae, ultricies eget. </p></div>

        </div>
4

2 回答 2

0

它应该工作！ 

<script type="text/javascript">

    $('.all').hide();
    $('#surprisesplash').fadeIn(1500);

    setTimeout(function() {

        $('#surprisesplash').fadeOut(1000, function() {
            $('.all').fadeIn(1500);    
        });

    }, 3000);

    </script>

提琴手

于 2012-09-11T11:13:12.113 回答
0

您可能至少应该等到它完成淡入后再开始淡出：

<script type="text/javascript">
    $(function(){
        $('.all').hide(); 
        $('#suprisesplash').fadeIn(1500, function() {
            $(this).delay(1500).fadeOut(1000, function() {
                $('.all').fadeIn();                     
            });
        });
    });
</script>
于 2012-09-11T11:13:34.530 回答