Tuesday 18 September 2012

Start and Stop Marquee using mouseover and mouseout event and News Ticker

Hi.... this is raj..........
Marquee is a HTML tag which is use to scroll an object over a page.
There are many direction (left,right,alternate). Where object moves.You can stop
and start a marquee using java script.Marquee object has methods start and stop.
Which are respectively used to start and stop a marquee.
Copy and paste following example save with .htm or .html extention...


<html>
<head>
<title>Girfa : Java Script Marquee Demo </title>
<script language="javascript">
function stopM()
{
var ob=document.getElementById('m1');
ob.stop();
}
function startM()
{
var ob=document.getElementById('m1');
ob.start();
}
</script>
</head>

<body>
<div style="height:210px;width:210px;border:outset 3px blue"">
<marquee onmouseover="stopM()" id="m1"
onmouseout="startM()" >
<a href="a.jpg"><img src="a.jpg" height=200px width="200px">
<a href="b.jpg"><img src="b.jpg" height=200px width="200px">
</marquee>
</div>
</body>
</html>




News Ticker

<div style="height:200px;width:150px;background-color:aqua;border:outset 3px red">
<marquee direction="up" scrollamount="5" onmouseover="this.stop()" onmouseout="this.start()">
<a href="#"><span> Enter your link text </span></a> <br><br>
<a href="#"><span> Enter your link text </span></a> <br><br>
<a href="#"><span> Enter your link text </span></a> <br><br>
<a href="#"><span> Enter your link text </span></a> <br><br>
</marquee>
</div>
Replace # symbols with your link URL and provide appropriate text for your link

1 comment: