[jQuery] stop by mouseover and run by mouseout
hi,
i have a function who displayed alternate content from 3 DIVs with a
fadeIn
Now i want to try, that the display rotation stoped if my mousepointer
goes in the DIV but i doesnt work.
whats my misstake?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://
www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html;
charset=utf-8" />
<title></title>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
function fadeEngine(x) {
var total_divs=3;
var y=x;
if ( !over ) {
if(x==total_divs) y=1; else y++;
$("#fade"+x).css("display","none");
$("#fade"+y).fadeIn("slow");
$("#container").hover(
function() { over = this.id; },
function() { over = false; });
}
setTimeout('fadeEngine('+y+')',3000);
}
fadeEngine(0);
</script>
</head>
<body>
<div id="container">
<div id="fade1" class="faders">Content one</div>
<div id="fade2" class="faders" style="display:none">Content two</
div>
<div id="fade3" class="faders" style="display:none">Content three</
div>
</div>
<div class="blocker"> </div>
</body>
</html>