View Full Version : Fading Message Scroller - Text Problem

05-24-2007, 04:03 PM
1) Script Title: Fading Scroller

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex2/fadescroll.htm

3) Describe problem:

I want to try and keep the same style and formatting of my webpage within the scrolling box, but I don't know how to properly manipulate the <div> tag to incorporate styles. If I use <font> tags and such in the content line, then the text and links don't fade anymore and just appear!

I need someone to please help me and see how I can manipulate my code to get my styles to fade in (or to manipulate the original script to match my page text and link formatting).

For an example, please visit http://breakthrough-music.co.nr/index3.html on the left menu.

Here is a chunk of the source code as of now:

var fcontent=new Array();
begintag='<div style="padding: 5px;">';//set opening tag, such as font declarations
fcontent[0]="<a href='http://www.all-guitar-chords.com/index.php' target='_blank' class='news'><font class='text1'>All Guitar Chords</font></a><br><font class='text2'>This site has an amazing assortment of guitar resources including a chord finder, scale finder, chord progression generator, and much more.</font>";
fcontent[1]="<a href='http://www.guitargeek.com/' target='_blank' class='news'><font class='text1'>Guitar Geek</font></a><br><font class='text2'>This site is a database of all the known guitar setups of popular musicians. Visit this site if you want to find out how a particular guitarist achieves his/her sound.</font>";
fcontent[2]="<a href='blankchordchart.gif' target='_blank' class='news'><font class='text1'>Blank Chord Chart</font></a><br><font class='text2'>Here is a blank set of chord charts that you can print and use.</font>";
fcontent[3]="<a href='blankstaff.gif' target='_blank' class='news'><font class='text1'>Blank Music Staff</font></a><br><font class='text2'>Here is a blank set of music and tablature staffs that you can print and use.</font>";

When I use the <font class=" "> or some other tags, it seems to negate the effect of the fading. How can I get around this? I'm trying to publish this site so I can start lessons so reply as soon as you can. Thanks!

05-24-2007, 04:58 PM
You can't use the font tag, try span. But, since the fading effect is achieved by rotating the color style property, you cannot have different colored text. You can format the font-size and font-weight.

05-24-2007, 05:22 PM
Okay, thanks. I figured as much. So you are saying there is no way I can change the colour of the fading text? Does anyone know of an alternative scroller that can achieve this?

05-25-2007, 05:16 PM
I looked around a bit on Dynamic Drive here, guided by my knowledge of the scripts available, but didn't find anything that quite fit. So, since I had been working on a random color generator, I decided to have a shot at this myself. It couldn't be all that hard. Here is the result:


Use your browser's 'view source' to get the well commented code.