我如何在mouseenter上滑動li類並在mouseleave上滑動？

Question

我試圖在mouseenter上添加一張幻燈片，然後在mouseleave上滑動到正在使用圖像交換腳本使用懸停功能的多個li類。

<script type> 
$(document).ready(function() { 
    $('#thumb ul li a').hover(
      function() { 
       var currentBigImage = $('#gallery img').attr('src'); 
       var newBigImage = $(this).attr('src'); 
       var currentThumbSrc = $(this).attr('rel'); 
       switchImage(newBigImage, currentBigImage, currentThumbSrc); 
      }, 
      function() {} 
      ); 
      function switchImage(imageHref, currentBigImage, currentThumbSrc) { 
       var theBigImage = $('#gallery img'); 
       if (imageHref != currentBigImage) { 
       theBigImage.fadeOut(250, function(){ 
        theBigImage.attr('src', imageHref).fadeIn(250); 
        var newImageDesc = $("#thumb ul li a img[src='"+currentThumbSrc+"']").attr('alt'); 
        $('p#desc').empty().html(newImageDesc); 
       }); 
      } 
    } 
}); 
</script 

當我嘗試使用下面在同一個腳本上面那樣的劇本，下$('#thumb ul li a').hover(，它打破了交換圖像和李類不滑動或做任何現有的懸停功能。

$(document).ready(function() { 
    $('#thumb ul li a').hover(
     function(){ 
      $(this).stop().animate({left:'20px'}, 500) 
     }, 
     function(){ 
      $(this).stop().animate({right:'20px'}, 500) 
}); 

我應該運行單獨的腳本，一個交換圖像和另一個滑動，我定義爲李班#thumb ul li a下的鏈接？謝謝！

Answer 1

而不是使用懸停兩套綁定的，你爲什麼不嘗試使用：

$('#thumb ul li a').bind("mouseenter", function() {}); 

和

$('#thumb ul li a').bind("mouseleave", function() {}); 

您的一組功能之一？

您也可以嘗試使用您的綁定命名空間，如：

.bind("mouseenter.name1", function() {}) 
.bind("mouseenter.name2", function() {}) 
.bind("mouseleave.name1", function() {}) 
.bind("mouseleave.name2", function() {})