在DIV的隱藏部分：懸停仍有效，可見

我有一個簡單的編碼：http://jsfiddle.net/8AMa4/20/（愚蠢的顏色只是指示;））在DIV的隱藏部分：懸停仍有效，可見

基本上它的工作，但有一個小故障，我不知道怎麼修。在div中有圖片「頁面」，當您按下按鈕時滑動到一邊，一次只能看到一個。當您懸停可見圖片時，會出現一些淡入淡出。問題在於懸停中的這種衰退也出現在div的應該被隱藏的部分。（你可以在jsfiddle的例子中看到它，如果你將鼠標移動到man div的右側）。

任何人都可以幫我一個解決方案嗎？我應該在哪裏改變2個「效應」（懸停和滑動）？

HTML：

<div class="tab-box"> 

    <div class="tabs"> 
    <div class="tab">1</div> 
    <div class="tab">2</div> 
    <div class="tab">3</div> 
    </div> 

    <div class="items"> 
    <div class="item" style="background: red;"> 
     <a href="#"><span class="rollover"></span><img class="thumbnail" alt="" src="http://www.sxc.hu/pic/m/s/sk/skapie/1218910_guitar.jpg"/></a> 
    </div> 
    <div class="item" style="background: blue;"> 
     <a href="#"><span class="rollover"></span><img class="thumbnail" alt="" src="http://www.sxc.hu/pic/m/s/sk/skapie/1218910_guitar.jpg"/></a> 
    </div> 
    <div class="item" style="background: green;"> 
     <a href="#"><span class="rollover"></span><img class="thumbnail" alt="" src="http://www.sxc.hu/pic/m/s/sk/skapie/1218910_guitar.jpg" /></a>  
    </div> 
    </div> 
</div>

的jQuery：

$(document).ready(function() { 
    $('.tab-box').each(function() { 
     var left = 0; 
     var $tabbox = $(this); 
     var width = $tabbox.width(); 

     $(this).find('.tab').each(function() { 
      var shift = left; 

      $(this).click(function() { 
       $tabbox.find('.items').animate({marginLeft: shift + 'px'}); 
       $tabbox.find('.tab').removeClass('active'); 
       $(this).addClass('active'); 
      }); 

      left -= width; 
     }); 

     $(this).find('.tab:eq(0)').addClass('active'); 
    }); 

});

來源

2013-05-04 Szandra05

請附上您的代碼，而不是隻是一個鏈接到的jsfiddle。 – 2013-05-04 19:36:09

Szandra：正如@JamesMontagne所說，這一次我將它*固定爲*你，但將來請包括（相關）代碼。 – 2013-05-04 19:37:33

您在.tab-box錯過了position:relative。

工作： http://jsfiddle.net/8AMa4/26/

來源

2013-05-04 19:39:31 tobspr

OMG。這麼小的錯誤。謝謝sooooooo多:)遺憾的是忘記了代碼，我不習慣問:) – Szandra05 2013-05-04 19:44:01

在DIV的隱藏部分：懸停仍有效，可見

回答

相關問題