How to Rotate a Quote in JavaScript
A relevant, pithy quote can set the tone for a website. Quotes are also useful to separate thematic elements on individual pages or sections of posted text. The danger of leaving any static text, even a well-crafted epigram, is that it eventually becomes part of the background. Return visitors to your page will read static text only so many times before it becomes invisible, or worse, makes your site seem stale. Selecting a collection of short quotations and rotating them during each page view is one option that will help keep your page fresh for repeat visitors.
Other People Are Reading
Instructions
-
-
1
Open the HTML source file for the page in a program or text editor.
-
2
Define the Java script in the file's header section:
<script language="JavaScript">
-
-
3
Set the length of time to display each quotation and write the function to display them:
var seconds=3;
function rotate()
{
var Quotation=new Array()
-
4
Insert the quotations to display in an array and close the script:
Quotation[0] = 'Never pet a burning badger';
Quotation[1]= 'Don't put that in your mouth, you don't know where it's been';
Quotation[2]= 'I told you a million times not to exaggerate';
Quotation[3]= '2+2=5 -- For very large values of 2';
}
</script>
-
5
Insert the function into the <body> of the HTML file where you want it to be displayed:
<script>
window.onload=start;
</script>
-
1
Tips & Warnings
Since the size of the array is not defined with the function, any number of quotations can be inserted into the array. Array numbering must begin with 0.
The script in one section:
<script language="JavaScript">
var seconds=3;
function rotate()
{
var Quotation=new Array()
Quotation[0] = 'Never pet a burning badger';
Quotation[1]= 'Don't put that in your mouth, you don't know where it's been';
Quotation[2]= 'I told you a million times not to exaggerate';
Quotation[3]= '2+2=5 -- For very large values of 2';
}
</script>
//body section
<body>
.
<script>
window.onload=start;
</body>
References
- Photo Credit Hemera Technologies/PhotoObjects.net/Getty Images
