Body content

Body content

Hi, I write this code, but does not work as I want.
When you open a page you see only a logo in the middle of the screen and then dissapears slowly (is the part I write and it works), but then I want the index appears slowly, this is the part I can not do. I had prrobed with show() and append() but does not works as I expect.

What I am doing wrong?

Here is my code:

  1. <!DOCTYPE html>
  2. <html>
  3.     <head>
  4.         <title></title>
  5.         <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  6.         <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  7. <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.js"></script>

  9.         <script>
  10.         $(document).ready(function() {
  11.            
  12. $('body').append('<div class="header"><a href="/"><img src="image/blue_minify.png" width="60" height="60" border="0"></a></div>');
  14.  $('.header').fadeIn(1000,function(){
  15. setTimeout("$('.header').fadeOut(1000,function(){$(this).remove()})",1000);
  17.     });               
  18. $('.one').show();
  19. });
  20.        


  23. </script>
  24.     </head>
  25.     <body>
  26.         <div style="display: none;" class="one" >Hola</div>
  27.     </body>
  28. </html>

Thanks for your attention.


Sandy