PDA

View Full Version : add a box to homepage with text that changes


Jane
02-05-2008, 01:48 PM
Hi, I am very new to Dreamweaver, i have inherited a site which i update. i have been asked to add the following to the homepage.

A box of text which we will use as testimonials which once someone is on the homepage, the testimonials change every few seconds.

I dont have a clue where to begin with this, so any help or pointers in the right directions would be appreciated.

mangofreak
02-05-2008, 03:45 PM
what technology are you using?? html, php, asp, jsp. Generally you know this by looking at the extension of your files.

Jane
02-05-2008, 06:31 PM
Hi Mangofreak, thanks for your quick reply, am only using html at the moment.

tux
02-05-2008, 06:59 PM
Hello Jane and welcome to the forum,

Try this javascript.

Place the following code in the head of your page....

<script language="JavaScript">
function rotateEvery(sec)
{
var Quotation=new Array()

// QUOTATIONS
Quotation[0] = 'First quotation';
Quotation[1] = 'Second quotation';
Quotation[2] = 'Third quotation';
Quotation[3] = 'Fourth quotation';
Quotation[4] = 'Fiveth quotation';
Quotation[5] = 'Sixth quotation';
Quotation[6] = 'You can add <b>as many</b> quotations <b>as you like</b>';

var which = Math.round(Math.random()*(Quotation.length - 1));
document.getElementById('textrotator').innerHTML = Quotation[which];

setTimeout('rotateEvery('+sec+')', sec*10000);
}
</script>

... then where you have this...

<body>

... replace it with this...

<body onload="rotateEvery(1)">

Then where you want your quotes to appear put this in your code....

<div id="textrotator"><!--Quotations will be displayed here--></div>

Replace 'First quotation' with your first quote and so on with rest. You can add as many as you wish. The script is set up to change every 10 seconds but you can change it as you wish, ie. 10secs is 10000.

Let me know how you get on, good luck.

Regards, Paul

mangofreak
02-05-2008, 07:04 PM
Depending on your knowledge, here area couple of options.
One, Create a number if images with your testimonials and make an animated gif. That's is an easy option.

Another is to go with javascript. You can find many examples out there. Here is one.
http://www.dynamicdrive.com/dynamicindex2/fadescroll.htm

hope it helps.

d a v e
02-05-2008, 07:40 PM
mangofreak - the animated gif would be quite hard to make accessible! (for screen reader users etc)

Jane
02-05-2008, 08:30 PM
thanks very much for your reply, i will have a look at the script

Jane
02-05-2008, 08:32 PM
Hello Jane and welcome to the forum,

Try this javascript.

Place the following code in the head of your page....

<script language="JavaScript">
function rotateEvery(sec)
{
var Quotation=new Array()

// QUOTATIONS
Quotation[0] = 'First quotation';
Quotation[1] = 'Second quotation';
Quotation[2] = 'Third quotation';
Quotation[3] = 'Fourth quotation';
Quotation[4] = 'Fiveth quotation';
Quotation[5] = 'Sixth quotation';
Quotation[6] = 'You can add <b>as many</b> quotations <b>as you like</b>';

var which = Math.round(Math.random()*(Quotation.length - 1));
document.getElementById('textrotator').innerHTML = Quotation[which];

setTimeout('rotateEvery('+sec+')', sec*10000);
}
</script>

... then where you have this...

<body>

... replace it with this...

<body onload="rotateEvery(1)">

Then where you want your quotes to appear put this in your code....

<div id="textrotator"><!--Quotations will be displayed here--></div>

Replace 'First quotation' with your first quote and so on with rest. You can add as many as you wish. The script is set up to change every 10 seconds but you can change it as you wish, ie. 10secs is 10000.

Let me know how you get on, good luck.

Regards, Paul
thank you Tux for your reply, i will have a play with the script and no doubt be back with another question. thanks again, really appreciate your reply

mangofreak
02-05-2008, 09:12 PM
mangofreak - the animated gif would be quite hard to make accessible! (for screen reader users etc)

That's a good thing to remember.

domedia
02-05-2008, 10:03 PM
mangofreak - the animated gif would be quite hard to make accessible! (for screen reader users etc) That's actually an interesting observation. We should all try to make things accessible of course.
Tux's javascript would just make an empty div for non-javascript readers, right? Would an even better option be to have all 5 quotations in your HTML, while having JS set their visibility? I'm not a javascript programmer myself, so I don't know if this would be an advantageous approach or not.