3

我在开发网站的 iPhone 版本时使用 jQTouch(及其内置动画)。所以,我有一个静态菜单:

<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's 中。我的问题是当用户在这样的页面上时,隐藏具有与 的 相同的哈希链接的项目iddiv它属于并且与 相同。location.hash

因此,click链接上的事件(通过动画将用户移动到另一个div)是不合适的,因为location.hash只有在动画完成时才会发生变化。

这就是问题所在:如何捕获 jQTouch 动画完成来解决问题?也许我可以用 jQuery 本身来做,但是怎么做呢?

谢谢。

编辑: 我找到了解决方案。所以,我把它贴在这里。

  $('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);              
  });
4

1 回答 1

0

这适用于 Safari 和 Chrome 吗?对我来说,它只适用于 Firefox。

于 2010-11-01T22:50:18.527 回答