5

我正在使用CSS3Dan Eden 的动画。

我在处理jquery悬停或点击事件时遇到了麻烦。

这是我正在研究的小提琴

  1. 请注意,div 在动画铰链效果下从屏幕上掉下来,但随后又回到原来的位置。我需要它永久地从屏幕上掉下来,或者直到重新加载页面。

  2. 您在其中看到的jquery片段只是我一直在使用的替代后备,因为我还不能jquery使用CSS动画。(该片段在我的网站上有效,但由于某种原因它在小提琴中不起作用。)

那么如何使用单击(或悬停)事件触发CSS动画?jquery

单击后,该 div 不应再次出现。

我尝试过的事情:

jquery addClass,根据丹的建议

上述页面 URL 上给出的示例:

$('#yourElement').addClass('animated bounceOutLeft');

我也尝试将CSS3 .animatedand更改.hinge为使用:active,但没有运气,如果我没记错的话,它仍然将 div 放回去而不是让它永久脱落。

如果有人能指出我的方向。我花了几天时间试图让整个事情顺利进行。我大部分时间都在阅读我能找到的关于这个主题的所有内容。我想学习如何做到这一点,而不仅仅是为我修好它。

如果我缺少任何信息,我是这个论坛的新手,所以请放轻松。:)

解决方案,已解决:

$('#pricetag_overlay1 a').click(function(){ 
            $('#pricetag_overlay1').toggleClass("animated hinge",function(){
               $(this).remove();
            });
        });       
4

1 回答 1

3

我已经更新了你的小提琴,可以按照你的喜好工作

要使用 jquery 监控 CSS3 动画,请参阅此链接

笔记:

$(window).load(function(){}) 

上面的脚本只会在初始页面加载时触发

所以更喜欢使用

$(document).ready(function(){});
于 2012-10-15T06:05:05.317 回答