Results 1 to 1 of 1

Thread: How to create Fly-in Header text using Javascript

  1. #1

    How to create Fly-in Header text using Javascript

    A script that flys in from the left edge of the browser a header text. Requires IE4+ or NS6, with all other browsers simply bypassing the animation.


    Add the below code where you wish the header to appear on the page. You may need to alter the value "-400" contained inside the <h2> tag to readjust the initial offset of the header, depending on the width of the header (longer=larger offset).

    HTML Code:
    <script>
    //set style for NS4 to ''
    if (document.layers)
    var ns4def=''
    </script>
    
    <h2 id="flyin" style="position:relative;left:-800px;font-style:italic" style=&{ns4def};>Welcome to our Homepage!</h2>
    
    
    <script language="JavaScript1.2">
    if (document.getElementById||document.all)
    var crossheader=document.getElementById? document.getElementById("flyin").style : document.all.flyin.style
    
    function animatein(){
    if (parseInt(crossheader.left)<0)
    crossheader.left=parseInt(crossheader.left)+20+"px"
    else{
    crossheader.left=0
    crossheader.fontStyle="normal"
    clearInterval(start)
    }
    }
    
    if (document.getElementById||document.all)
    start=setInterval("animatein()",50)
    
    
    </script>
    for Demo see attachment file below
    Attached Files Attached Files

Similar Threads

  1. Create a “Parry Hotter” Text Effect in Photoshop
    By ghaza in forum Graphics Designing
    Replies: 1
    Last Post: 11-22-2013, 06:45 AM
  2. HTML to JavaScript converter
    By ghaza in forum Javascript and js libraries
    Replies: 0
    Last Post: 11-12-2013, 05:12 AM
  3. Image Clock (JavaScript)
    By ghaza in forum Javascript and js libraries
    Replies: 0
    Last Post: 11-10-2013, 05:29 PM
  4. How to remove render-blocking JavaScript
    By Patrick Sexton in forum Javascript and js libraries
    Replies: 0
    Last Post: 08-29-2013, 04:04 PM
  5. javascript this keyword
    By AP admin in forum Javascript and js libraries
    Replies: 0
    Last Post: 07-03-2010, 06:17 PM

Posting Permissions

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