Scrolling Text

[Rose]

Is there a way to have a scrolling message below the header and user links (cp, home, members, etc...). I'd like to have a scrolling tag that I can change daily/weekly whatever to say what I want. For instance, I run a Simpsons (tm) dedicated message board and I would like to run one of Bart's Chalkboard sayings across the board and I would change it daily. Or, I suppose it could be used to welcome members, news, anything really. Is this a hack or a template edit?

Thanks in advance,

Rose
www.simpsonsboard.com

[Psychdrone]

this wouldn't be a hack!

All ya got to do is change the header around to your amusment

[Rose]

Originally posted by Psychdrone
this wouldn't be a hack!

All ya got to do is change the header around to your amusment

Just add the html in the header template for a scrolling text? coolness! Thanks for the quick response.


*sheepish look* Maybe do you have the basic html for that? I can edit to my preference, but I need a base to start with. :s

[Rose]

Anyone?

[cyrus]

Hi Rose ( we meet again lol )

Well, I have this at my site and have made it easy by adding a custom bbcode for it.

How to add scroll text bbcode

Go to Admin panel and ... :-

Custom vB Codes >> Add
And then add in the following info:-

vB Code tag : scroll
vB Code replacement : <table height=100 width=300><tr><td style="filter:bold(color=black strength=1);font-family:arial;font-weight: BOLD;font-size:'14'"><marquee direction="left">{param}<br></table>
vB Code example : [scroll]This Scrols Across The Screen[/scroll]
vB Code explanation : anything you want
Use {option} ? : Select NO

If you want the text to scroll RIGHT, change the text in red to *right* ( without the *'s)

=============================

Ive trried makign it as simple as possible, let me know if you get stuck anywhere

Byeeeeeeeeeeeeeee

[Rose]

Thanks Cyrus!!

Actually, in my need not to be so lazy (as I was waiting for someone to respond when I could have easily looked up html code for scrolling text and edited to fit), I did search around a bit last night. I found a neat scrolling text that I like. I placed one version of scrolling in the header template and one version of another scrolling in the footer template.

I'm not sure what the problem was, but with the footer in place, the header wouldn't scroll. But I took out the footer and now everything works grand.

Sorry, I seem to have gone off topic. Again, Thanks Cyrus!! Check out www.simpsonsboard.com and let me know what you think of the scrolling!

[sphinx]

very nice only wish I had more of an understanding of how it worked I could get the usual scroll text in a post but couldn't figure out where to add the scroll thing in the template anyone have an idiot proof way I am pretty new to html as you can probably gather,a nice effect though that you have put to work well nice one

[Rose]

Sphinx - I can give you the code I used. I got this code from www.dynamicdrive.com. You can get loads of dhtml scripts and stuff from there, however this is the only thing I've used so far, so I don't guarantee it.

Anyway, for what I did I simply put the following text into my header template (below the toplinks). however, you can insert it where ever you want. Please be advised, however, that I can't offer support as I'm a cut'n'paste html newbie, too.

But, with a little concentration you will figure it out. If you have problems, let me know and I'll try to help, I just can't guarantee anything.

<script language="JavaScript1.2">

/*
Pausing updown message scroller- 
Last updated: 99/07/05 (Bugs fixed, ability to specify background image for scroller)
? Dynamic Drive (www.dynamicdrive.com)
For full source code, installation instructions,
100's more DHTML scripts, and Terms Of
Use, visit dynamicdrive.com
*/

//configure the below five variables to change the style of the scroller
var scrollerwidth=500
var scrollerheight=35
var scrollerbgcolor='#0E3652'
//set below to '' if you don't wish to use a background image
var scrollerbackground='scrollerback.gif'

//configure the below variable to change the contents of the scroller
var messages=new Array()
messages[0]="<font face='Arial'><a href='http://www.simpsonsboard.com/ted'>Visit <b><i>The Smallville Torch</i></b></a></font>"
messages[1]="<font face='Arial'>Bart's Chalkboard Quote of the Week:</font>"
messages[2]="<font face='akbar'<i>Beans are neither fruit nor musical</i></font>"
messages[3]="<font face='Arial'><a href='http://www.simpsonsboard.com/register.php?action=signup'>Not registered?  Click here!</a></font>"
messages[4]="<font face='Arial'><a href='http://www.simpsonsboard.com/showthread.php?threadid=342'>Go here for information on linking to SB.</a></font>"

///////Do not edit pass this line///////////////////////

if (messages.length>1)
i=2
else
i=0

function move1(whichlayer){
tlayer=eval(whichlayer)
if (tlayer.top>0&&tlayer.top<=5){
tlayer.top=0
setTimeout("move1(tlayer)",3000)
setTimeout("move2(document.main.document.second)",3000)
return
}
if (tlayer.top>=tlayer.document.height*-1){
tlayer.top-=5
setTimeout("move1(tlayer)",100)
}
else{
tlayer.top=scrollerheight
tlayer.document.write(messages[i])
tlayer.document.close()
if (i==messages.length-1)
i=0
else
i++
}
}

function move2(whichlayer){
tlayer2=eval(whichlayer)
if (tlayer2.top>0&&tlayer2.top<=5){
tlayer2.top=0
setTimeout("move2(tlayer2)",3000)
setTimeout("move1(document.main.document.first)",3000)
return
}
if (tlayer2.top>=tlayer2.document.height*-1){
tlayer2.top-=5
setTimeout("move2(tlayer2)",100)
}
else{
tlayer2.top=scrollerheight
tlayer2.document.write(messages[i])
tlayer2.document.close()
if (i==messages.length-1)
i=0
else
i++
}
}

function move3(whichdiv){
tdiv=eval(whichdiv)
if (tdiv.style.pixelTop>0&&tdiv.style.pixelTop<=5){
tdiv.style.pixelTop=0
setTimeout("move3(tdiv)",3000)
setTimeout("move4(second2)",3000)
return
}
if (tdiv.style.pixelTop>=tdiv.offsetHeight*-1){
tdiv.style.pixelTop-=5
setTimeout("move3(tdiv)",100)
}
else{
tdiv.style.pixelTop=scrollerheight
tdiv.innerHTML=messages[i]
if (i==messages.length-1)
i=0
else
i++
}
}

function move4(whichdiv){
tdiv2=eval(whichdiv)
if (tdiv2.style.pixelTop>0&&tdiv2.style.pixelTop<=5){
tdiv2.style.pixelTop=0
setTimeout("move4(tdiv2)",3000)
setTimeout("move3(first2)",3000)
return
}
if (tdiv2.style.pixelTop>=tdiv2.offsetHeight*-1){
tdiv2.style.pixelTop-=5
setTimeout("move4(second2)",100)
}
else{
tdiv2.style.pixelTop=scrollerheight
tdiv2.innerHTML=messages[i]
if (i==messages.length-1)
i=0
else
i++
}
}

function startscroll(){
if (document.all){
move3(first2)
second2.style.top=scrollerheight
second2.style.visibility='visible'
}
else if (document.layers){
document.main.visibility='show'
move1(document.main.document.first)
document.main.document.second.top=scrollerheight+5
document.main.document.second.visibility='show'
}
}

window.onload=startscroll

</script>




<ilayer id="main" width=&{scrollerwidth}; height=&{scrollerheight}; bgColor=&{scrollerbgcolor}; background=&{scrollerbackground}; visibility=hide>
<layer id="first" left=0 top=1 width=&{scrollerwidth};>
<script language="JavaScript1.2">
if (document.layers)
document.write(messages[0])
</script>
</layer>
<layer id="second" left=0 top=0 width=&{scrollerwidth}; visibility=hide>
<script language="JavaScript1.2">
if (document.layers)
document.write(messages[1])
</script>
</layer>
</ilayer>

<script language="JavaScript1.2">
if (document.all){
document.writeln('<span id="main2" style="position:relative;width:'+scrollerwidth+';height:'+scrollerheight+';overflow:hiden;background-color:'+scrollerbgcolor+' ;background-image:url('+scrollerbackground+')">')
document.writeln('<div style="position:absolute;width:'+scrollerwidth+';height:'+scrollerheight+';clip:rect(0 '+scrollerwidth+' '+scrollerheight+' 0);left:0;top:0">')
document.writeln('<div id="first2" style="position:absolute;width:'+scrollerwidth+';left:0;top:1;">')
document.write(messages[0])
document.writeln('</div>')
document.writeln('<div id="second2" style="position:absolute;width:'+scrollerwidth+';left:0;top:0;visibility:hidden">')
document.write(messages[1])
document.writeln('</div>')
document.writeln('</div>')
document.writeln('</span>')
}
</script>

As you can see, you don't edit past the 'do not edit past this line' line. And you can customize your messages up top, add an unlimited number of messages (as far as I know it's unlimited) and you can link them to a url if you'd like. Play around and have fun!

I'm at www.simpsonsboard.com or thecharmedgirl@hotmail.com

[sphinx]

many thanks I figured it out after your post above and yeah strictly a cut and paste here too gain thanks for the help you made it understandable,

[Rose]

Anytime.