Hello
I'm looking for a solution that I couldn't find (good enough) by myself,
yet. First let me please exposure some code:
<title>delayed reaction<title>
<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
<script type="text/javascript">
$(function()
{
$("div").addClass("out");
$("div").hover(
function()
{
$(this).removeClass("out").addClass("over");
},
function ()
{
$(this).removeClass("over").addClass("out");
});
});
</script>
<style type="text/css">
.out { color:black; font: 12px/3.0em Verdana; }
.over { color:red; font: bold 18px/3.0em Verdana; }
</style>
</head>
<body>
<div>some content</div>
<div>some content</div>
<div>some content</div>
<div>some content</div>
<div>some content</div>
<div>some content</div>
<div>some content</div>
<div>some content</div>
</body>
</html>
if you run this code and move the mouse from top to bottom, "some content"
will change color an size. There will be some "flicker-effect" because all
elements subsequently will change. Instead of this I'm looking for a
solution, where the change in color and size happens only if the mouse rests
a while over the target element. In other words ...
1) the mouse is over the first element (color and size is "red" and
"bigger").
2) the mouse will be moved downwards to the last element (color and size of
the elements between should not change because the mouse "is on the road").
3) mouse has reached the last element and stayes there - lets say a minimum
of 600 milliseconds (the text will become "red" and "bigger", delayed)
While moving the mouse from the top to the bottom element, the elements
between should not change. I think this can be accomplished using a timer -
some kind of delayed reaction - but I didn't find a good solution yet. Maybe
you have some hints? Thanks in advance!
fran
--
View this message in context:
http://old.nabble.com/delayed-reaction-tp26926791s27240p26926791.html
Sent from the jQuery General Discussion mailing list archive at Nabble.com.
