Добрый день!
Уважаемые знатоки, как сделать так чтобы при быстром перемещении мышки по элементам события mouseenter/mouseleave успевали срабатывать. Ниже приведен пример, если перемещать курсор по дивам медленно то все работает отлично, если быстро то события не успевают срабатывать и все глючит, заранее спасибо!
<!DOCTYPE html>
<html class="no-js" lang="en-US" >
<head>
<meta charset="UTF-8" />
<link rel="stylesheet" href="themes/style.css" />
<script type="text/javascript"
src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js">
</script>
<script>
$(document).ready(
function()
{
$(".thumb").mouseenter(function(event)
{
$("#"+event.target.id).children(".img").animate({ opacity: 1 }, "slow");
$("#"+event.target.id).children(".init_img").fadeTo(0, 0);
})
$(".thumb").mouseleave(function(event)
{
$("#"+event.target.id).children(".img").fadeTo(0, 0);
$("#"+event.target.id).children(".init_img").fadeTo(0, 1);
})
}
);
</script>
</head>
<body>
<div class="thumb" id="project1">
<img src="thumbnails/01.jpg" class="img">
<img src="thumbnails/в01.jpg" class="init_img">
</div>
<div class="thumb" id="project2">
<img src="thumbnails/02.jpg" class="img">
<img src="thumbnails/в02.jpg" class="init_img">
</div>
<div class="thumb" id="project3">
<img src="thumbnails/03.jpg" class="img">
<img src="thumbnails/в03.jpg" class="init_img">
</div>
</body>
</html>