0

这是我所拥有的：

<div id="wrapper">
    <div id="container">

    </div>
</div>

#container
{  
    transition: opacity .2s ease-in-out;
    -webkit-transition: opacity .2s ease-in-out;
    -moz-transition: opacity .2s ease-in-out;
    -o-transition: opacity .2s ease-in-out;
    -ms-transition: opacity .2s ease-in-out;
    top: 0%;
    z-index: 0;
    width: 100%;
    height: 100%;

}
#wrapper
{
     width: 2048px;
     height: 1536px;
     position: absolute;
}

容器 div 包含带有点击事件的热点内容。包装器用于通过 css 动画左右移动内容。但是，在应用此动画后，动画效果很好：

$('#wrapper').css('-webkit-transition','-webkit-transform 0s ease-out').css('-webkit-transform','translate3d(' + '2048px,0px,0)');

容器 div 内的热点事件没有响应....我认为静态定位的热点现在已关闭。有没有更好的方法来实现这一目标？

@Connor：这是一个小提琴链接，但它不是一个工作副本，但希望它足以让您了解它的设置方式...... http://jsfiddle.net/dTVqx/

另一个更新：我为热点添加了边框，热点确实出现在正确的位置和顶部，所以似乎在执行 css 动画后事件可能以某种方式被禁用？

这是我当前的 live() 调用：

$('.modal').live('tap',function(event) 
{
  ...
}

I ALSO DID TRY on()

$(".modal").on("tap", function()
{
...
}

but on() does not work at all, even before the transition
4

1 回答 1

0

我在你的小提琴中没有看到 live() 调用，但从 1.7 开始，live() 已被弃用。尝试改用 on() 和 off() 函数，看看是否能产生您正在寻找的功能？

于 2012-05-14T17:04:36.440 回答