Auto refresh auto text script

@Grunn1988Dec 13.2009

Hey!

I’ve got a script for my blog which shows a random quote. I’d like to have it refreshed every 15 seconds and have fade out and fade in with a new quote, but I’m not really sure how to do it. Does any of you know it? Thanks in advance.

This is the script.

[code=html]<script language=”JavaScript”> <!– var r_text = new Array (); r_text[0] = “random text 0”; r_text[1] = “random text 1”; r_text[2] = “random text 2”; r_text[3] = “random text 3”; r_text[4] = “random text 4”; r_text[5] = “random text 5”; var i = Math.floor(6*Math.random())

document.write(r_text[i]);

//–> </script>[/code]

to post a comment

JavaScript

14 Comments(s) _↴

@mityaDec 13.2009 — #You need setInterval(). So something like (note I've compacted it, too):

[CODE]var r_text = [
 "random text 0",
 "random text 1",
 "random text 2",
 "random text 3",
 "random text 4",
 "random text 5", [COLOR="Gray"]//uh-oh, this comma shouldn't be there (though apparently only Safari cares)[/COLOR]
 ];
 
 function doText() {
 var i = Math.floor([COLOR="Red"](r_text.length-1)[/COLOR]*Math.random())
 document.getElementById('poo').innerHTML = r_text[i];
 }
 
 [COLOR="Blue"]var myInterval = setInterval(doText, 15000);[/COLOR][/CODE]

Note that, by using r_text.length instead of 6 (in red), you won't have to update that line when you add or subtract elements to/from the array.

For the animation side of it, look into jQuery's animate() method, by which you can fade in/out by animating on the opacity property. But this should get you started.

@Grunn1988authorDec 13.2009 — #Thanks for the red part, that works. The rest doesn't really work. Isn't there just a simple line I can add to make it refresh? ?

@mityaDec 13.2009 — #Er, it does work, I just tried it in 3 browsers.

I added 2 lines to your script - one to instantiate the interval, another to wrap your document.write (which is better element.innerHTML) into a function. How much more simple do you want it?

@Grunn1988authorDec 13.2009 — #For some reason it doesn't work in my Safari browser :S

What lines would you add when not changing the script? I think it has something to do with the rest of my site. Took me ages to get a random text script ?

@mityaDec 13.2009 — #Buggar - damned copy and paste. I left a comma that, apparently, IE, FF and Opera don't care about but Safari does. Remove the comma after "random text 5" and try again.

@mityaDec 13.2009 — #p.s. if you want 15 second intervals, change my 1000 to 15000.

@Grunn1988authorDec 13.2009 — #I'm sorry to disappoint you, but it still isn't working ?

@mityaDec 13.2009 — #Do tell me you made an element with an ID 'poo', right? Perhaps I should have pointed that out, but I did say we were using element.innerHTML here. As you can see, my script is trying to put your random text into an element with ID 'poo'.

If you did, try this cleaned-up version of the script. If this doesn't work, I give up - nothing non-standard here. Even Safari should cope.

[CODE]var r_text = ["random text 0", "random text 1", "random text 2", "random text 3", "random text 4", "random text 5"];
 
 function doText() {
 var i = Math.floor((r_text.length-1)*Math.random())
 document.getElementById('poo').innerHTML = r_text[i];
 }
 
 var myInterval = setInterval(doText, 15000);[/CODE]

@Grunn1988authorDec 13.2009 — #Too bad, it isn't working ?

And no, i'm not using poo XD

But thanks anyway! ?

@mityaDec 13.2009 — #Confused - if you don't have an element with that ID then of course it won't work. Make the element and it will.

OK I tried...

@Grunn1988authorDec 13.2009 — #Haha. Thanks.

To be honest: I'm a complete noob ?

@mityaDec 13.2009 — #OK - make a new .htm page with exactly and only the following code and tells me if it works. If it does, we're on the right lines.

[CODE]<html>
 
 <head>
 
 <script>
 var r_text = ["random text 0", "random text 1", "random text 2", "random text 3", "random text 4", "random text 5"];
 
 function doText() {
 var i = Math.floor((r_text.length-1)*Math.random())
 document.getElementById('poo').innerHTML = r_text[i];
 }
 
 var myInterval = setInterval(doText, 15000);
 </script>
 
 </head>
 
 <body>
 <div id="poo"></div>
 </body>
 
 </html>[/CODE]

Bear in mind you'll need to wait 15 seconds for anything to appear. Change 15000 to 500 for now just to test, perhaps.

@Grunn1988authorDec 13.2009 — #Jup, that works. But the problem is that text needs to be in another <div>

(Thanks so much for all your help?)

@mityaDec 13.2009 — #No problem.

You never said you wanted it to go in another div. Just give that DIV an ID and put that ID in my script in place of 'poo'.

Also in #JavaScript _↴

Disable Esc key Enter key press execute button click javascript opener.focus() not working?

Success!

Help @Grunn1988 spread the word by sharing this article on Twitter...

Tweet This

Auto refresh auto text script

14 Comments(s) _↴

Also in #JavaScript _↴

Success!

Social

Version

Auto refresh auto text script

14 Comments(s) ↴

Also in #JavaScript ↴

Success!

The web is an endless sea of information. Don't miss the boat... Subscribe!

Social

Version

14 Comments(s) _↴

Also in #JavaScript _↴