<marquee id='scroll_news' style="font-family:Book Antiqua; color: #FFFFFF" bgcolor="#000080" ><div onMouseOver="document.getElementById('scroll_news').stop();" onMouseOut="document.getElementById('scroll_news').start();">News 1 News 2 News 3 News 4 ....... More news here </div></marquee>
As you have seen the scrolling news stops when mouse pointer is kept over them and starts scrolling again when mouse is removed.
<marquee id='scroll_news2' style="font-family:Book Antiqua; color: #FFFFFF" bgcolor="#000080" ><div onMousedown="document.getElementById('scroll_news2').stop();" onMouseUp="document.getElementById('scroll_news2').start();">News 1 News 2 News 3 News 4 ....... More news here </div></marquee>
<marquee id='scroll_news' style="font-family:Book Antiqua; color: #FFFFFF" bgcolor="#000080" ><div onMouseOver="document.getElementById('scroll_news').stop();" onMouseOut="document.getElementById('scroll_news').start();"><a href=../php_tutorial/site_map.php>PHP</a> | <a href=../sql_tutorial/site_map.php>SQL</a> | <a href=../>plus2net Home</a></div></marquee>
The same events can be triggered by onmouseup and onmousedown events
<marquee id='scroll_news2' style="font-family:Book Antiqua; color: #FFFFFF" bgcolor="#000080" >News 1 News 2 News 3 News 4 ....... More news here </marquee>
<input type=button onClick="document.getElementById('scroll_news2').stop();" value='Stop Scrolling'> <input type=button onClick="document.getElementById('scroll_news2').start();" value='Start Scrolling'>
<marquee id='scroll_news4' style="font-family:Book Antiqua; color: #FFFFFF" bgcolor="#000080" >News 1 News 2 News 3 News 4 ....... More news here </marquee>
<input type='Button' value='Stop' id ='b1' onClick='button_click()';>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
function button_click()
{
if(document.getElementById('b1').value=="Start"){
document.getElementById('b1').value="Stop";
document.getElementById('scroll_news4').start();
}else{
document.getElementById('b1').value="Start";
document.getElementById('scroll_news4').stop();
}
}
// End -->
</script>
Balaji | 20-03-2013 |
Hay... This is amazing for bigiiners..!!! Thanks...!!! |
sekhar | 20-06-2014 |
nice explanation |
gidion | 15-08-2014 |
something good |
Joe | 17-10-2014 |
Very Nice |
gobolin | 23-11-2014 |
hey guys, nice feature, but is there a way to have a single button to maybe on first click start a marquee and on second stop it, then start and stop and on and on? thanks :) |
smo | 26-11-2014 |
By adding JavaScript function it can be done. Example is added. |
Muhammad hussain | 06-04-2015 |
Its amazing work and i love it it is running nicely on my blog thanks for sharing |
swapnaja | 03-08-2015 |
Nice One .Helpfull |
mantoo kumar | 17-06-2016 |
This is very useful for begiiners. Nice |
shukrab khan | 01-07-2016 |
its just amazing some of marquee are not working in both browsers but its work for me in both. Thank you. |
pranati | 24-08-2016 |
Nice One .Helpfull |
15-05-2021 | |
Wow Bro Your Animation is Very Helpfull |