Я использую jQTouch (и его встроенную анимацию) при разработке версии веб-сайта для iPhone. Итак, у меня есть статическое меню:
<ul class="rounded">
<li class="arrow"><a href="#item1" class="fade">Item 1</a></li>
<li class="arrow"><a href="#item2" class="fade">Item 2</a></li>
<li class="arrow"><a href="#item3" class="fade">Item 3</a></li>
<li class="arrow"><a href="#item4" class="fade">Item 4</a></li>
</ul>
это включено в некоторые div
. Моя проблема заключается в том, чтобы скрыть элемент, который имеет ссылку с таким же хэшем, как id
из div
, он принадлежит и такой же, как location.hash
, когда пользователь находится на такой странице.
Таким образом, событие click
в ссылке (которое перемещает пользователя к другому div
с анимацией) не подходит, поскольку location.hash
изменяется только после завершения анимации.
Вот и вопрос: Как отловить завершение анимации jQTouch для решения проблемы? Может быть, я могу сделать это с помощью самого jQuery, но как?
Спасибо.
EDIT: я нашел решение. Итак, выкладываю сюда.
$('body > div').bind('pageAnimationEnd', function(){
//wait a bit for the end of the animation
//and hash change
setTimeout(function(){
//current div id
divId = '#' + $('.current .toolbar + .section').parent().attr('id');
//test whether there's a link to the same page
link = $(divId + ' .rounded li').find('a[href='+divId+']');
if ( divId == location.hash
&& link.length > 0 )
{
$('a[href='+divId+']').parent().fadeOut(0);
}
else
{
$('a[href='+divId+']').parent().fadeIn(0);
}
}, 100);
});