Javascript Code for Horizontal Scrolling Text

Hi ,

I need the Javascript code for Scrolling Horizontal Text instead of using the Marquee tag, as the Marquee tag is not supported by the Netscape Browser. Kindly Do help me out.

Regards
Smita

Nov 3 '08 #1

Subscribe Post Reply

14969

acoder

16,027

Expert Mod 8TB

What have you managed or searched for so far?

The basics are setInterval (for timing) and the style.left property for setting the position.

Nov 3 '08 #2

balurajeev

Try this

I think this will help you

Expand|Select|Wrap|Line Numbers

 var l1 = 0; // Left of ticker In pixel, Or 0 To position relative

var t1 = 0; // top of ticker In pixel, Or 0 To position relative

var w1 = 400; // width of ticker In pixel

var ie = document.all ? true : false;

var first = true;

var l2 = l1 + w1;

var l3 = l1 - l2;

var l = l2;

var pos;

function tickinit() {

if(ie) {

if(l1 == 0 && t1 == 0) {

pos = document.all['tickpos'];

l1 = getLeft(pos);

t1 = getTop(pos);

}

ticktext.style.posTop = t1;

}

else {

if(l1 == 0 && t1 == 0) {

pos = document.anchors['tickpos'];

l1 = pos.x;

t1 = pos.y;

}

document.ticktext.pageY = t1;

}

l2 = l1 + w1;

l3 = l1 - l2;

l = l2;

setInterval('tick()', 10);

}

function getLeft(ll) {

if(ll.offsetParent)

return (ll.offsetLeft + getLeft(ll.offsetParent));

else

return (ll.offsetLeft);

}

function getTop(ll) {

if(ll.offsetParent)

return (ll.offsetTop + getTop(ll.offsetParent));

else

return (ll.offsetTop);

}

function tick() {

l = l - 0.5;

if(l < l3) l = l2;

cl = l1 - l;

cr = l2 - l;

if(ie) {

ticktext.style.posLeft = l;

ticktext.style.posTop = t1;

ticktext.style.clip = "rect(auto "+cr+"px auto "+cl+"px)";

if(first) ticktext.style.visibility = "visible";

}

else {

document.ticktext.pageX = l;

document.ticktext.clip.left = cl;

document.ticktext.clip.right = cr;

if(first) document.ticktext.visibility = "show";

}

first = false;

}
 
</script>
 
</head>

<body onload="tickinit()">
 
<!-- STEP THREE: Copy this code into the BODY of your HTML document -->
 
<a name="tickpos"> </a>
 
<div id="ticktext" style="position:absolute;font-family:arial;font-size:14pt;visibility:hidden;">

<nobr>Doesn't this message scroller look great? You can even insert links like this: <a href="http://www.yahoo.com" target="_blank">yahoo.com</a> Now it repeats.</nobr>

</div>

</body>

</html>

Nov 3 '08 #3

smita232

Try this

I think this will help you

Expand|Select|Wrap|Line Numbers

var l1 = 0; // Left of ticker In pixel, Or 0 To position relative

var t1 = 0; // top of ticker In pixel, Or 0 To position relative

var w1 = 400; // width of ticker In pixel

var ie = document.all ? true : false;

var first = true;

var l2 = l1 + w1;

var l3 = l1 - l2;

var l = l2;

var pos;

function tickinit() {

if(ie) {

if(l1 == 0 && t1 == 0) {

pos = document.all['tickpos'];

l1 = getLeft(pos);

t1 = getTop(pos);

}

ticktext.style.posTop = t1;

}

else {

if(l1 == 0 && t1 == 0) {

pos = document.anchors['tickpos'];

l1 = pos.x;

t1 = pos.y;

}

document.ticktext.pageY = t1;

}

l2 = l1 + w1;

l3 = l1 - l2;

l = l2;

setInterval('tick()', 10);

}

function getLeft(ll) {

if(ll.offsetParent)

return (ll.offsetLeft + getLeft(ll.offsetParent));

else

return (ll.offsetLeft);

}

function getTop(ll) {

if(ll.offsetParent)

return (ll.offsetTop + getTop(ll.offsetParent));

else

return (ll.offsetTop);

}

function tick() {

l = l - 0.5;

if(l < l3) l = l2;

cl = l1 - l;

cr = l2 - l;

if(ie) {

ticktext.style.posLeft = l;

ticktext.style.posTop = t1;

ticktext.style.clip = "rect(auto "+cr+"px auto "+cl+"px)";

if(first) ticktext.style.visibility = "visible";

}

else {

document.ticktext.pageX = l;

document.ticktext.clip.left = cl;

document.ticktext.clip.right = cr;

if(first) document.ticktext.visibility = "show";

}

first = false;

}

</script>

</head>

<body onload="tickinit()">



<a name="tickpos"> </a>

<div id="ticktext" style="position:absolute;font-family:arial;font-size:14pt;visibility:hidden;">

<nobr>Doesn't this message scroller look great? You can even insert links like this: <a href="http://www.yahoo.com" target="_blank">yahoo.com</a> Now it repeats.</nobr>

</div>

</body>

</html>

Thanks for the reply... but am getting a horizontal scroll on the browser window.

Nov 3 '08 #4

acoder

16,027

Expert Mod 8TB

Try this

I think this will help you

The script looks out-dated. There are better cross-browser scripts.

Nov 3 '08 #5

acoder

16,027

Expert Mod 8TB

Thanks for the reply... but am getting a horizontal scroll on the browser window.

So what did you want instead?

Nov 3 '08 #6

thimmappa

If you are trying to achive scrolling text through javaScript you can have a look at the free code provided at http://pc.byethost17.com/scripts/javascript/?id=54
Copy the code in your <script> tags in your HTML file and use the fucntion to call it using the function scroller = new Scroller(SCROLLING_TEXT_ID, SLOWER_ID, FASTER_ID, CHANGE_DIRECTION_ID);

Sep 16 '10 #7

by: mr_burns | last post by:

Hi, Is it possible to disble horizontal scrolling using CSS? I want to try and use two backgrounds, one tiling vertically and part of the body background, which will not force scrolling, but one...

HTML / CSS

scrollTo only if horizontal scrollbar

by: anna | last post by:

How to tell if a horizontal scrollbar is present? I only want to use scrollTo if horizontal scrollbar is present. window.scrollbars.visibility doesn't specify which scrollbar is present, so it...

Javascript

Convert javascript to vb script?

by: D Newsham | last post by:

Hi, This javascript creates a table that has a header and side column that do not move while scrolling through the table. I need to convert this to vb script. Can anybody help, or do you have...

Javascript

Horizontal scrolling

by: Just D. | last post by:

Does anybody know how to disable the horizontal scrolling on ASPX form? What JAVA script should be used for that? The standard methods don't help and I'm looking for some JAVA function to fire it...

Javascript

Javascript problem in Firefox

by: Karin Jensen | last post by:

Hi - I am trying to use Javascript to put material inside a table (i.e. alongside the previous material) if the user's screensize is big enough and outide the table (beneath table) if it isn't. ...

Javascript

DataGrid - Vertical/Horizontal scroll

by: sumit | last post by:

Hi, I made a data grid vertically as well as horizontal scrollable as number of columns are very large!! But when i scroll horizontally then header is not visible as it also gets scrolled...

ASP.NET

datagrid and intellimouse and horizontal scrolling

by: Dan Hinsley | last post by:

I just got one of the new Microsoft Mice that has a "tilt wheel" for horizontal scrolling. This works in a listbox in my VB.NET app, but doesn't work for a datagrid that does have a horizontal...

Visual Basic .NET

Javascript and Firefox 1.5

by: lmarceglia | last post by:

Hi, I have this website that doesn't work in Firefox 1.5: www.pianetaluca.com The HTML source is: <TITLE>PianetaLuca</TITLE> </HEAD>

Javascript

Need To Disable Horizontal Scrolling - Why Is HScroll Property Ignored?

by: j0rd4n | last post by:

I have a user control that needs to allow vertical scrolling but not horizontal scrolling. In the user control's resize event, I need to adjust the size of all the children controls. For this to...

C# / C Sharp

How to turn on java script in a villaon keypad mobile phone

by: Charles Arthur | last post by:

How do i turn on java script on a villaon, callus and itel keypad mobile phone

Java

Batch import of multiple excel files into the database

by: ryjfgjl | last post by:

If we have dozens or hundreds of excel to import into the database, if we use the excel import function provided by database editors such as navicat, it will be extremely tedious and time-consuming...

Data Management

Merging data from multiple Excel files

by: ryjfgjl | last post by:

In our work, we often receive Excel tables with data in the same format. If we want to analyze these data, it can be difficult to analyze them because the data is spread across multiple Excel files...

Data Management

Navigating the Data Structures and Algorithms (DSA)

by: BarryA | last post by:

What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...

Algorithms / Advanced Math

What is ONU?

by: marktang | last post by:

ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...

General

Changing the language in Windows 10

by: Hystou | last post by:

Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...

Windows Server

Problem With Comparison Operator <=> in G++

by: Oralloy | last post by:

Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...

C / C++

Maximizing Business Potential: The Nexus of Website Design and Digital Marketing

by: jinu1996 | last post by:

In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...

Online Marketing

Discussion: How does Zigbee compare with other wireless protocols in smart home applications?

by: tracyyun | last post by:

Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...

General

Javascript Code for Horizontal Scrolling Text

Similar topics