Advanced Search

Page 1 of 2 12 LastLast
Results 1 to 10 of 12

Thread: Flying Text Modification

  1. #1
    Join Date
    Nov 2005
    Posts
    13
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Flying Text Modification

    It's me again! I found this flying text animation on dynamic drive, but it only works for IE5+. How do I make it Netscape and Firefox compatible?

    HTML Code:
    <h2><span id="fly"></span></h2>
    
    <script>
    window.onerror=new Function("return true")
    
    //Flying Letters script- by Matthias (info@freejavascripts.f2s.com)
    //For this script and more, visit http://www.dynamicdrive.com
    
    //Configure message to display. Use "$" for linebreak
    message = "Thanks for visiting Dynamic Drive!" // $ = taking a new line
    distance = 50 // pixel(s)
    speed = 100 // milliseconds
    
    if (!document.all)
    document.write('<h2>'+message+'</h2>')
    
    </script>
    
    <script language="JavaScript1.2">
    
    txt="";num=0;num4=0;flyofle="";flyofwi="";flyofto=""
    function stfly(){for(i=0;i != message.length;i++){if(message.charAt(i) != "$"){txt=txt+"<span style='position:relative;visibility:hidden;' id='n"+i+"'>"+message.charAt(i)+"<\/span>"};else{txt=txt+"<br>"}};fly.innerHTML=txt;txt="";flyofle=fly.offsetLeft;flyofwi=fly.offsetWidth;flyofto=fly.offsetTop;fly2b()}
    function fly2b(){if(num4 != message.length){if(message.charAt(num4) != "$"){eval("n"+num4+".style.left=flyofle-n"+num4+".offsetLeft+flyofwi/2");eval("n"+num4+".style.top=flyofto-n"+num4+".offsetTop+distance");eval("fly3('n"+num4+"',eval(n"+num4+".style.left.substring(0,n"+num4+".style.left.length-2)),(eval(n"+num4+".style.left.substring(0,n"+num4+".style.left.length-2))/5),eval(n"+num4+".style.top.substring(0,n"+num4+".style.top.length-2)),(eval(n"+num4+".style.top.substring(0,n"+num4+".style.top.length-2))/5))")};num4++;setTimeout("fly2b()",speed)}}
    function fly3(target,lef2,num2,top2,num3){if((Math.floor(top2) != 0 && Math.floor(top2) != -1) || (Math.floor(lef2) != 0 && Math.floor(lef2) != -1)){if(eval("'"+lef2+"'").charAt(0) != '-'){lef2=lef2-num2};else{lef2=lef2+(-num2)};if(Math.floor(lef2) != -1){eval(target+".style.visibility='visible';"+target+".style.left=Math.floor(lef2)")};else{eval(target+".style.visibility='visible';"+target+".style.left=Math.floor(lef2+1)")};if(eval("'"+lef2+"'").charAt(0) != '-'){top2=top2-num3};else{top2=top2+(-num3)};if(Math.floor(top2) != -1){eval(target+".style.top=Math.floor(top2)")};else{eval(target+".style.top=Math.floor(top2+1)")};setTimeout("fly3('"+target+"',"+lef2+","+num2+","+top2+","+num3+")",50)}};
    
    stfly()
    
    </script>
    Thanks!
    Wren

  2. #2
    Join Date
    Jun 2005
    Location
    英国
    Posts
    11,878
    Thanks
    1
    Thanked 180 Times in 172 Posts
    Blog Entries
    2

    Default

    It looks to be quite badly written. I've bookmarked this one, and will rewrite it nicely with compatibility on the morrow, if no-one else has by then.
    Twey | I understand English | 日本語が分かります | mi jimpe fi le jbobau | mi esperanton komprenas | je comprends franšais | entiendo espa˝ol | t˘i Ýt hiểu tiếng Việt | ich verstehe ein bisschen Deutsch | beware XHTML | common coding mistakes | tutorials | various stuff | argh PHP!

  3. #3
    Join Date
    Nov 2005
    Posts
    13
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Thanks! Before anybody gets on me about posting in this forum...let me just apologize, I should have posted it in the DD scripts forum. My bad! If Twey still wants to work on the compatibility that would be much appreciated. I'll be checkin it out as well...
    Wren

  4. #4
    Join Date
    Jun 2005
    Location
    英国
    Posts
    11,878
    Thanks
    1
    Thanked 180 Times in 172 Posts
    Blog Entries
    2

    Default

    Done. I also got rid of those awful eval()s the author seemed to be so fond of, and added support for non-JS browsers.
    Code:
    <h2 id="fly">Thanks for visiting$Dynamic Drive!</h2>
    <script type="text/javascript">
    
    //Flying Letters script- by Matthias (info@freejavascripts.f2s.com)
    // Modified by Twey for efficiency and compatibility
    //For this script and more, visit http://www.dynamicdrive.com
    
    //Configure message to display. Use "$" for linebreak
    message = document.getElementById("fly").innerHTML; // $ = taking a new line
    distance = 50; // pixel(s)
    speed = 200; // milliseconds
    
    var txt="",
    	num=0,
    	num4=0,
    	flyofle="",
    	flyofwi="",
    	flyofto="",
    	fly=document.getElementById("fly");
    
    
    function stfly() {
    	for(i=0;i != message.length;i++) {
    		if(message.charAt(i) != "$")
    			txt += "<span style='position:relative;visibility:hidden;' id='n"+i+"'>"+message.charAt(i)+"<\/span>";
    		else
    			txt += "<br>";
    	}
    	fly.innerHTML = txt;
    	txt = "";
    	flyofle = fly.offsetLeft;
    	flyofwi = fly.offsetWidth;
    	flyofto = fly.offsetTop;
    	fly2b();
    }
    
    function fly2b() {
    	if(num4 != message.length) {
    		if(message.charAt(num4) != "$") {
    			var then = document.getElementById("n" + num4);
    			then.style.left = flyofle - then.offsetLeft + flyofwi / 2;
    			then.style.top = flyofto - then.offsetTop + distance;
    			fly3(then.id, parseInt(then.style.left), parseInt(then.style.left) / 5, parseInt(then.style.top), parseInt(then.style.top) / 5);
    		}
    		num4++;
    		setTimeout("fly2b()", speed);
    	}
    }
    
    function fly3(target,lef2,num2,top2,num3) {
    	if((Math.floor(top2) != 0 && Math.floor(top2) != -1) || (Math.floor(lef2) != 0 && Math.floor(lef2) != -1)) {
    		if(lef2 >= 0)
    			lef2 -= num2;
    		else
    			lef2 += num2 * -1;
    		if(Math.floor(lef2) != -1) {
    			document.getElementById(target).style.visibility = "visible";
    			document.getElementById(target).style.left = Math.floor(lef2);
    		} else {
    			document.getElementById(target).style.visibility = "visible";
    			document.getElementById(target).style.left = Math.floor(lef2 + 1);
    		}
    		if(lef2 >= 0)
    			top2 -= num3
    		else
    			top2 += num3 * -1;
    		if(Math.floor(top2) != -1)
    			document.getElementById(target).style.top = Math.floor(top2);
    		else
    			document.getElementById(target).style.top = Math.floor(top2 + 1);
    		setTimeout("fly3('"+target+"',"+lef2+","+num2+","+top2+","+num3+")",50)
    	}
    }
    
    stfly()
    
    </script>
    Tested in Firefox 1.0.7, Opera 8.51, Konqueror 3.5.0-1.2 and IE 6.
    Twey | I understand English | 日本語が分かります | mi jimpe fi le jbobau | mi esperanton komprenas | je comprends franšais | entiendo espa˝ol | t˘i Ýt hiểu tiếng Việt | ich verstehe ein bisschen Deutsch | beware XHTML | common coding mistakes | tutorials | various stuff | argh PHP!

  5. #5
    Join Date
    Nov 2005
    Posts
    13
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Problem here

    Hi-

    Sorry it's taken me so long to process this, got stuck doing other things. Alright so it works and it doesn't work. In IE6 the "fly" works but I can't get the variable "distance" to be modifiable (is that a word? In Firefox "distance" doesn't work at all and it returns a "type text" effect. I made no modifications to your code. The only thing I changed was the words that would be typed out. Any suggestions? I'm guessing this worked for you. Don't know why it's not working for me. I'm fine with the type text effect in Firefox but want to change the distance in IE6.

    Thanks~
    Wren

  6. #6
    Join Date
    Jun 2005
    Location
    英国
    Posts
    11,878
    Thanks
    1
    Thanked 180 Times in 172 Posts
    Blog Entries
    2

    Default

    is that a word?
    Yes
    In Firefox "distance" doesn't work at all and it returns a "type text" effect.
    Really? It does here.
    Mozilla/5.0 (X11; U; Linux i686; en-GB; rv:1.8) Gecko/20051201 Fedora/1.5-1.1.fc4.nr Firefox/1.5
    I will test in IE just as soon as Windows has finished doing its little filesystem-checking thing. Isn't it about time Microsoft came up with a journaled filesystem?
    /EDIT: Yes, works fine in IE (6) as well. Very strange. Does this happen for you if you don't change the text?
    Last edited by Twey; 01-20-2006 at 06:51 PM.
    Twey | I understand English | 日本語が分かります | mi jimpe fi le jbobau | mi esperanton komprenas | je comprends franšais | entiendo espa˝ol | t˘i Ýt hiểu tiếng Việt | ich verstehe ein bisschen Deutsch | beware XHTML | common coding mistakes | tutorials | various stuff | argh PHP!

  7. #7
    Join Date
    Dec 2006
    Posts
    27
    Thanks
    1
    Thanked 1 Time in 1 Post

    Default Help with script modification?

    I'd like to use this script to display the results of another function that I'm using instead of specifying a text string in a <div>. The results of the function are stored in the variable 'sn'. Is there an easy way to modify the script? I've given it my best shot, but since I don't know much JS, I'm struggling. Also, I'd like to keep the code in an external JS file with the function mentioned above. Is that doable? Thanks.

  8. #8
    Join Date
    Jun 2005
    Location
    英国
    Posts
    11,878
    Thanks
    1
    Thanked 180 Times in 172 Posts
    Blog Entries
    2

    Default

    Instead of:
    Code:
    message = document.getElementById("fly").innerHTML; // $ = taking a new line
    Use:
    Code:
    message = sn; // $ = taking a new line
    I know a little more about Javascript now than I did when I updated this script before, and could probably do a better job now.
    Twey | I understand English | 日本語が分かります | mi jimpe fi le jbobau | mi esperanton komprenas | je comprends franšais | entiendo espa˝ol | t˘i Ýt hiểu tiếng Việt | ich verstehe ein bisschen Deutsch | beware XHTML | common coding mistakes | tutorials | various stuff | argh PHP!

  9. #9
    Join Date
    Dec 2006
    Posts
    27
    Thanks
    1
    Thanked 1 Time in 1 Post

    Default Been there, tried that

    That seems like a simple enough answer, but I had already tried that. I tried it again and still have a big blank instead of any output. Do any of the other instances of "document.getElementById("fly").innerHTML" need to be changed? There's one just a few lines down in some variable declarations.

    Let me be specific to what I'm trying to accomplish. I'm running a calculation in an external JS. If the calculation has exactly 8 digits, then I want it to output the numbers using this script, else give an error message in a normal document.write fashion. Is my attempt to use this externally from the document throwing some things off?

  10. #10
    Join Date
    Jun 2005
    Location
    英国
    Posts
    11,878
    Thanks
    1
    Thanked 180 Times in 172 Posts
    Blog Entries
    2

    Default

    If the calculation has exactly 8 digits, then I want it to output the numbers using this script, else give an error message in a normal document.write fashion.
    Avoid document.write(). It treats the DOM as a string, slows down page load, and can't be used after the page has finished loading.
    Is my attempt to use this externally from the document throwing some things off?
    It may do, if you've included the flying-text script before the calculation script (so that sn isn't defined).
    Twey | I understand English | 日本語が分かります | mi jimpe fi le jbobau | mi esperanton komprenas | je comprends franšais | entiendo espa˝ol | t˘i Ýt hiểu tiếng Việt | ich verstehe ein bisschen Deutsch | beware XHTML | common coding mistakes | tutorials | various stuff | argh PHP!

Bookmarks

Posting Permissions

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