jQuery的懸停問題

我有一個HTML的結構是這樣的：jQuery的懸停問題

<ul id="carousel" class="jcarousel-skin-photos"> 
      <li><a href="images/content/featuredPhoto.jpg"><img src="images/content/featuredPhoto.jpg" alt="Lorem Ipsum Dolor Sit Amet..." /></a></li> 
      <li><a href="images/content/featuredPhoto.jpg"><img src="images/content/featuredPhoto.jpg" alt="Lorem Ipsum Dolor Sit Amet..." /></a></li> 

      <li><a href="images/content/featuredPhoto.jpg"><img src="images/content/featuredPhoto.jpg" alt="Lorem Ipsum Dolor Sit Amet..." /></a></li> 
      <li><a href="images/content/featuredPhoto.jpg"><img src="images/content/featuredPhoto.jpg" alt="Lorem Ipsum Dolor Sit Amet..." /></a></li> 
      <li><a href="images/content/featuredPhoto.jpg"><img src="images/content/featuredPhoto.jpg" alt="Lorem Ipsum Dolor Sit Amet..." /></a></li>    
      <li><a href="images/content/featuredPhoto.jpg"><img src="images/content/featuredPhoto.jpg" alt="Lorem Ipsum Dolor Sit Amet..." /></a></li> 
      <li><a href="images/content/featuredPhoto.jpg"><img src="images/content/featuredPhoto.jpg" alt="Lorem Ipsum Dolor Sit Amet..." /></a></li> 
      <li><a href="images/content/featuredPhoto.jpg"><img src="images/content/featuredPhoto.jpg" alt="Lorem Ipsum Dolor Sit Amet..." /></a></li> 
      <li><a href="images/content/featuredPhoto.jpg"><img src="images/content/featuredPhoto.jpg" alt="Lorem Ipsum Dolor Sit Amet..." /></a></li> 
      <li><a href="images/content/featuredPhoto.jpg"><img src="images/content/featuredPhoto.jpg" alt="Lorem Ipsum Dolor Sit Amet..." /></a></li> 
     </ul> 


     <a href="javascript:;" id="zoom">Yakınlaştır</a>

還有一點jQuery的代碼片段淡入/淡出效果：

$('ul#carousel li a').hover(
    function() { 
    $('a#zoom').fadeIn('fast'); 
    }, 
    function() { 
    $('a#zoom').fadeOut('slow'); 
});

在我想告訴a#zoom元素時結束徘徊在ul#carousel li a元素上。但是淡入淡出效果存在一些奇怪的現象。

This is my work page。您可以在線查看。

那麼我該如何解決這個問題呢？

來源

2009-11-25 fatihturan

對我而言看起來不錯 – marcgg 2009-11-25 14:00:17

只是對您的選擇器發表評論：您不需要指定「ul＃carousel」或「＃zoom」;相反，直接使用「#carousel」和「＃zoom」 – 2009-11-25 14:00:41

問題是 - 當懸停在li上並顯示縮放圖標並懸停在圖標上時它會消失？ – 2009-11-25 14:01:09

的問題正在發生，因爲當在縮放圖標，鼠標指針移動時，它不再被認爲在轉盤上，因此淡出踢。當淡出完成鼠標指針突然在轉盤上，因此淡入重新開始。

我認爲奇怪的行爲是眨眼縮放圖標。

要解決此問題，您必須通過將鼠標懸停事件處理程序添加到縮放圖標本身，以便在鼠標移過縮放圖標時取消淡出。

來源

2009-11-25 14:02:05

這應該是訣竅。 :) – 2009-11-25 14:03:11

我解決了這個奇怪這段代碼：

$('a#zoom').mouseover(function() { 
    $(this).stop(); 
});

感謝文森特。

來源

2009-11-25 15:45:34 fatihturan

jQuery的懸停問題

回答

相關問題