jquery-animate - .hover 上的无限循环与 backgroundImage

Question

  <script type="text/javascript">
    $(document).ready(function() {

      $('.istina').hover(function() {
        animate_loop = function() {
          $(this).css('backgroundImage', 'url(<?php print $base_path . $directory ?>/img/istina-hover.png)').animate({backgroundImage: 'url(/sites/all/themes/ruh/img/istina.png)'}, 500, function() { animate_loop(); } );
      }, function() {
          $(this).css('backgroundImage', 'url(<?php print $base_path . $directory ?>/img/istina.png)');
        }
        }
      )
    });

我有一个类的链接，<a class="istina">some text</a>我想在悬停时更改它的背景图像，而悬停时我想在 istina.png 和 istina-hover.png 之间切换

谢谢！

Answer 1

你不需要任何javascript来做到这一点，它可以是CSS驱动的......

html:

<a class="istina">some text</a>

css

#istina {  
background-image : url(istina.png); 
}

#istina :hover { 
background-image : url(istina-hover.png); 
}