тайм-аут на функцию наведения jQuery
В настоящее время я использую следующий код ниже, используя jQuery и функцию наведения, чтобы добавить элемент caption, когда пользователь наводит курсор на изображение. Это прекрасно работает в браузерах настольных компьютеров, однако при тестировании его на мобильных сенсорных устройствах, таких как iPad, когда пользователю требуется нажать на изображение, чтобы активировать функцию наведения, заголовок постепенно исчезает, как и ожидалось, но остается активным, пока пользователь не выберет другой объект на странице.
Я хотел бы знать простой способ изменить мой код JavaScript для обнаружения мобильных сенсорных устройств, а затем добавить к заголовку какой-либо вид или таймер, чтобы он автоматически исчезал через некоторое время?
<!-- include jQuery library -->
<script type="text/javascript" src="./_js/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
//On mouse over those thumbnail
$('.item-caption').hover(function() {
//Display the caption
$(this).find('.caption').stop(false,true).fadeIn(200);
},
function() {
//Hide the caption
$(this).find('.caption').stop(false,true).fadeOut(600);
});
});
</script>
</head>
<body>
<div class="item-caption"><a href="http://www.domain.com">
<div class="caption">
<ul>
<li><h2>TITLE</h2></li>
<li><h3>Description</h3></li>
</ul>
</div>
<img src="./_img/example_image.jpg"></a>
</div>
</body>
Любые идеи, мысли будут наиболее ценными.
Крис