How can I catch jQTouch animation completion?

I use jQTouch (and its built-in animations) when developing the iPhone version on the website. So I have a static menu:

<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>

which is included in some div. My problem is to hide the element that has the hash link, the same as id divit belongs, and the same as location.hashwhen the user is on such a page.

So, the event clickby reference (which moves the user to another one divwith the animation) is not suitable, because it location.hashchanges only after the animation is completed.

What is the question: how can I catch jQTouch animation completion to solve the problem? Maybe I can do it with jQuery, but how?

Thank.

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 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);              
  });
+3
1

Safari Chrome? Firefox.

0

Source: https://habr.com/ru/post/1755656/


All Articles