Hi,
I'm using <marquee>tag to notify some text to users. I did some research on stopping and playing again the marquee, but I couldn't find any information how I can reset/restart marquee.
I have < next and > previous button to control the marquee tag, however it looks awkward when I click those button because the marquee does not get reset once I click those buttons.
Please help,
Young
Reset Marquee
Moderator: General Moderators
Re: Reset Marquee
Hi this will help u....
<marquee direction=up width="195" height="300" scrollAmount=2.8 scrollDelay=70 class="sidelink" onmousedown="this.stop()" onmouseover="this.stop()" onmousemove="this.stop()" onmouseout="this.start()">
<a href="http://example.com/" target="_blank">example.com</a><br><br>
<a href="http://example.com" target="_blank">example.com</a><br><br>
<a href="http://example.com" target="_blank">example.com</a><br><br>
<a href="http://example.com" target="_blank">example.com</a><br><br>
<a href="http://example.com" target="_blank">example.com</a><br><br>
<a href="http://example.com" target="_blank">example.com</a><br><br>
<a href="http://example.com" target="_blank">example.com</a><br><br>
</marquee>
<marquee direction=up width="195" height="300" scrollAmount=2.8 scrollDelay=70 class="sidelink" onmousedown="this.stop()" onmouseover="this.stop()" onmousemove="this.stop()" onmouseout="this.start()">
<a href="http://example.com/" target="_blank">example.com</a><br><br>
<a href="http://example.com" target="_blank">example.com</a><br><br>
<a href="http://example.com" target="_blank">example.com</a><br><br>
<a href="http://example.com" target="_blank">example.com</a><br><br>
<a href="http://example.com" target="_blank">example.com</a><br><br>
<a href="http://example.com" target="_blank">example.com</a><br><br>
<a href="http://example.com" target="_blank">example.com</a><br><br>
</marquee>
Last edited by onion2k on Wed Aug 05, 2009 2:53 am, edited 1 time in total.
Reason: Spam links removed.
Reason: Spam links removed.
Re: Reset Marquee
Or u can try this one...
<html>
<head>
<script type="text/javascript">
var UpdateInterval = 1;
var PixelPerInterval = 1;
var scorllerInterval;
function start_scroll_left()
{
scorllerInterval = setInterval(scroll_left, UpdateInterval);
}
function scroll_left()
{
document.getElementById('scroller').scrollLeft -= PixelPerInterval;
}
function start_scroll_right()
{
scorllerInterval = setInterval(scroll_right, UpdateInterval);
}
function scroll_right()
{
document.getElementById('scroller').scrollLeft += PixelPerInterval;
}
function stop_scrolling()
{
clearInterval(scorllerInterval);
}
</script>
</head>
<body>
<div id="scroller" style="overflow: hidden; white-space: nowrap; border:#999999 1px solid; top:200px; left:50px; right:750px; position:absolute;">
<img src="images1.bmp" border="0"/>
<img src="images2.bmp" border="0"/>
<img src="images3.bmp" border="0"/>
</div>
<p align="center" style="position:relative;">
<span id="left" onmouseover="start_scroll_left()" onmouseout="stop_scrolling()"><img src="prev.png" border="0"/></span>
<span id="right" onmouseover="start_scroll_right()" onmouseout="stop_scrolling()"><img src="next.png" border="0" /></span>
</p>
</body>
</html>
<html>
<head>
<script type="text/javascript">
var UpdateInterval = 1;
var PixelPerInterval = 1;
var scorllerInterval;
function start_scroll_left()
{
scorllerInterval = setInterval(scroll_left, UpdateInterval);
}
function scroll_left()
{
document.getElementById('scroller').scrollLeft -= PixelPerInterval;
}
function start_scroll_right()
{
scorllerInterval = setInterval(scroll_right, UpdateInterval);
}
function scroll_right()
{
document.getElementById('scroller').scrollLeft += PixelPerInterval;
}
function stop_scrolling()
{
clearInterval(scorllerInterval);
}
</script>
</head>
<body>
<div id="scroller" style="overflow: hidden; white-space: nowrap; border:#999999 1px solid; top:200px; left:50px; right:750px; position:absolute;">
<img src="images1.bmp" border="0"/>
<img src="images2.bmp" border="0"/>
<img src="images3.bmp" border="0"/>
</div>
<p align="center" style="position:relative;">
<span id="left" onmouseover="start_scroll_left()" onmouseout="stop_scrolling()"><img src="prev.png" border="0"/></span>
<span id="right" onmouseover="start_scroll_right()" onmouseout="stop_scrolling()"><img src="next.png" border="0" /></span>
</p>
</body>
</html>