1

昨日見つけたばかりanimate.cssで、自分のウェブサイトに適用したいと思っていました。しかし、問題は、div に何度もカーソルを合わせても、1 回しか機能しなかったことです。たぶん、コーディングのテクニックをきちんと把握していなかったのでしょう。これが私のコードです：

    window.setTimeout( function(){
   $('#test').removeClass('animated bounce')},
1300);

$(function(){
    $('#test').hover(function(){
            $('#test').addClass('animated bounce');

    });
});

すべての提案に感謝します!

4

1 に答える 1

1

これを試して

$('#test').hover(function(){
    $(this).addClass('animated bounce');

}, function(){
    $(this).removeClass('animated-bounce');
});

またはさらに良い

  $('#test').hover(function(){
     $(this).addClass('animated-bounce');
  });

  var element = document.getElementById('test');
  element.addEventListener("webkitAnimationEnd", function(){
    $(element).removeClass('animated-bounce');
  }, false);

実際。

cssでそれを行うだけで使用しないのはなぜですか

#test:hover{
   animation: animateName ....;
}

あなたが抱えている問題は、クラスを追加するとアニメーションが機能するが、もう一度ホバーすると、クラスが既に存在するためクラスが再度追加されないためCSS、クラス名を変更せずにいつホバーしたかがわからないことです.

アニメーション イベント ドキュメントへのリンク

アニメーション終了デモ

CSS :ホバーデモ

于 2013-07-13T16:58:29.420 に答える