View Full Version : How can I make this text rotator random?

The Chef
07-11-2012, 12:16 AM
I pulled a simple Javascript snippet that performs a simple fade in/out quote rotator.

Here is a demo of it: Demo (http://www.vijayjoshi.org/examples/textRotator.html)

Right now it runs through the quotes as I input them by use of DIVs

<div id="quotes">
<div>Before turning to those moral and mental aspects of the matter which
present the greatest difficulties, let the inquirer begin by mastering
more elementary problems.

<div>How often have I said to you that when you have eliminated the
impossible, whatever remains, however improbable, must be the truth?

Here is the Javascript that runs it:

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/
<script type="text/javascript">
function setupRotator()
if($('.textItem').length > 1)
setInterval('textRotate()', 3000);
function textRotate()
var current = $('#quotes > .current');
if(current.next().length == 0)

How can I modify this script to make it pull a quote randomly?
I tried changing current.next() to current.Math.random() but no luck.

Thanks for the help!

The Chef
07-11-2012, 04:15 PM

Philip M
07-11-2012, 05:17 PM
No idea, I don't use jQuery. You might do better if you posted in the jQuery forum. Try this instead.


<body onload = "changetext()">

<div id="textrotator" style="font: 16px arial bold; width: 100%; color: rgb(255,255,255)"></div>

<script type = "text/javascript">

var hexinput= 255; // initial color value.

var quotation = [];
quotation[0] = "...The big brown fox jumped over the tall fence"
quotation[1] = "...The wind is blowing cold snow across the dark black road"
quotation[2] = "...Fall has many colors and black is not one of them"
quotation[3] = "...the blue bird lives in the big red barn"
quotation[4] = "...Mr. Grant really believes that the Bullhas skills, which are widespread"
quotation[5] = "...Sixth quotation"

Array.prototype.shuffle = function() {
var s = [];
while (this.length) s.push(this.splice(Math.random() * this.length, 1)[0]);
while (s.length) this.push(s.pop());
return this;
quotation.shuffle(); // shuffle the quotations

function fadingtext(){
if(hexinput>0) {
hexinput-=11; // increase color value
document.getElementById("textrotator").style.color="rgb("+hexinput+","+hexinput+","+hexinput+")"; // Set color value.
else {
hexinput=255; //reset hex value

var count = 0;
var len = quotation.length;
function changetext(){
document.getElementById("textrotator").innerHTML=quotation[count]; // and display it
count ++;
if (count >len-1) {
quotation.shuffle(); // shuffle the quotation array again
count = 0; // reset the counter
if (count >len-1) {count = 0}


//window.onload=changetext(); // if not in <BODY onload>



"A good reputation can take years to aquire, a bad one takes a few seconds"

The Chef
07-12-2012, 01:14 AM
Thanks! I'll give this a shot. And woops - forgot this was jQuery.