How to make a text (with HTML tags )scrolling?

#1 November 17th, 2006, 11:15 AM

I have this script that scrolls the plain text.

<script type="text/javascript">
var msg = 'My scrolling text. ..';
var myTimeout;
function scrollMsg() {
document.getElementById('textScroll').innerHTML = msg;
msg = msg.substring(1,msg.length) + msg.substring(0,1);
myTimeout = setTimeout(scrollMsg, 200);
}
</script>

How must I change the script so that it will work with HTML text too?.

Thank you any idea.
L.

#2 November 17th, 2006, 12:55 PM

PythonistL wrote:

Quote:

I have this script that scrolls the plain text.
>
<script type="text/javascript">
var msg = 'My scrolling text. ..';
var myTimeout;
function scrollMsg() {
document.getElementById('textScroll').innerHTML = msg;
msg = msg.substring(1,msg.length) + msg.substring(0,1);
myTimeout = setTimeout(scrollMsg, 200);
}
</script>
>
>
How must I change the script so that it will work with HTML text too?.
>
Thank you any idea.
L.

Hi

If the element named 'textScroll' is a container (div or span) it is already
working with HTML text.
What is excactly the problem?

Regards,
Erwin Moller

#3 November 17th, 2006, 03:25 PM

Hello Erwin ,
Thank you for your reply.
So here it is complete my script with HTML. page
##############################
<HTML>
<HEAD>
<TITLE>Scrolling Message Script</TITLE>
<style TYPE="text/css">
#textScroll{
background-color:#F8F8F8;
text-align:center;
font-size: 20px;
font-weight:bold;
}

</style>
<script type="text/javascript">
var msg = ' My scrolling text. <a href="/www.google.com/"><small>Click
here to go to Google</a';
var myTimeout;
function scrollMsg() {
document.getElementById('textScroll').innerHTML = msg;
msg = msg.substring(1,msg.length) + msg.substring(0,1);
myTimeout = setTimeout(scrollMsg, 200);
}
</script>
</HEAD>
<BODY bgcolor="white" onLoad="scrollMsg()">
<div id ="textScroll" onmouseover="if (myTimeout) { clearTimeout(
myTimeout); }" onmouseout="myTimeout = setTimeout(scrollMsg, 200);" >

</div>
</BODY>
</HTML>
##############
It does NOT show properly scrolling text if I use HTML during the time
is works.
It starts well but then it shows HTML tags without coding properly

Where can be a problem?
Thank you for help
Regards,
Lad.

#4 November 17th, 2006, 03:45 PM

the problem is that your function is stripping the characters one by
one and so when it gets t<a href and the < is stripped, there i sno
longer any valid html in the string.

I know there are plenty of js functions that can do scrolling text, but
any old browser can run this:
<marquee width=55%>
<a href="http://www.google.com/wow">wow scrollingtastic</aHello,
scrolly world
</marquee>

even if you use an xhtml strict served as xhtml/xml,
just use javascript to create a div element and plonk it into the DOM,
that way it will sneak past the validators, and js will still be the
driver.

I mean I know its not a wonderful object oriented solution but at least
its effecient, cross browser, backwards compatible and simple

#5 November 17th, 2006, 05:35 PM

shimmyshack wrote:

Quote:

the problem is that your function is stripping the characters one by
one and so when it gets t<a href and the < is stripped, there i sno
longer any valid html in the string.
>
I know there are plenty of js functions that can do scrolling text, but
any old browser can run this:
<marquee width=55%>
<a href="http://www.google.com/wow">wow scrollingtastic</aHello,
scrolly world
</marquee>

Thank you for your idea. Yes, it works, but how can I stop scrolling
when I put a mouse cursor over the scrolling text ?
And restart again when I move cursor from the text?

Thank you for reply
Lad

#6 November 17th, 2006, 10:15 PM

PythonistL wrote:

Quote:

shimmyshack wrote:

Quote:

the problem is that your function is stripping the characters one by
one and so when it gets t<a href and the < is stripped, there i sno
longer any valid html in the string.

I know there are plenty of js functions that can do scrolling text, but
any old browser can run this:
<marquee width=55%>
<a href="http://www.google.com/wow">wow scrollingtastic</aHello,
scrolly world
</marquee>

>
Thank you for your idea. Yes, it works, but how can I stop scrolling
when I put a mouse cursor over the scrolling text ?
And restart again when I move cursor from the text?

Can you post your current code?

Peter

How to make a text (with HTML tags )scrolling?

Popular Articles

What is Bytes?