Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    Regular Coder
    Join Date
    Jul 2002
    Location
    Brighton, UK
    Posts
    282
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Smile fade in page onload

    hello, I am trying to get the page to fade in when it loads.. instead of using the microsoft enterpage metahead value..

    here is the code I am trying, but no luck

    <html>

    <head>
    <SCRIPT LANGUAGE="JavaScript">
    function fadeInPage() {
    if (document.getElementById("fadeDiv").filters.alpha.opacity < 100){
    document.getElementById("fadeDiv").filters.alpha.opacity += 10;
    eval('setTimeout("fadeInPage()",100)');
    }
    else{
    document.getElementById('fadeDiv').style.visibility = "visable"
    }
    }
    </script>
    </head>

    <body onLoad="fadeinpage()">

    <DIV ID="fadeDiv" style="visibility:hidden">
    your page code goes here
    </DIV>
    </body>

    </html>
    <marquee>thanks</marquee>

  • #2
    Regular Coder
    Join Date
    Jun 2002
    Posts
    626
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Check out this link to a wizard at Dynamic Drive:
    http://www.dynamicdrive.com/dynamicindex3/document2.htm

    I believe you want the blendin, but there are several other effects also. Good Luck.

  • #3
    Regular Coder
    Join Date
    Jun 2002
    Posts
    626
    Thanks
    0
    Thanked 0 Times in 0 Posts
    OOPS that uses the META tag, which is what you don't want. Here is one from JavaScriptkit's Free Script section:
    http://www.wsabstract.com/script/cut4.shtml

  • #4
    Regular Coder
    Join Date
    Jun 2002
    Location
    Mumbai, India
    Posts
    218
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Here's the code :

    Code:
    <html> 
    <head> 
    <SCRIPT LANGUAGE="JavaScript"> 
    function fadeInPage()
    { 
     if(document.getElementById("fadeDiv").filters("alpha").opacity < 100)
     { 
      document.getElementById("fadeDiv").filters("alpha").opacity += 10; 
      setTimeout("fadeInPage()",100); 
     } 
     else
     { 
      document.getElementById('fadeDiv').style.visibility = "visible";
     } 
    } 
    </script> 
    </head> 
    
    <body onLoad="fadeInPage()"> 
    
    <DIV ID="fadeDiv" style="filter:Alpha(opacity=0); width:100%"> 
    Welcome to my Homepage!
    </DIV>
    
    </body> 
    </html>

  • #5
    New Coder
    Join Date
    Oct 2009
    Location
    Nepal
    Posts
    48
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Just try this.. It works

    Just download the jquery.js from jquery library and pot the below code at head

    <script type="text/javascript" src="js/jquery.js"></script>

    <script type="text/javascript">
    $(document).ready(function(){

    $(document).ready(function () {
    $('.nav').fadeIn(3000);
    });

    });
    </script>

    after that <div class="nav" style="display:none"> this is the DIV which will fade in while page loads..

    Good LUck


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •