問題與jQuery週期插件

將jQuery週期插件的圖像後得到了其底邊框的是這樣的：

任何想法爲什麼？

這裏是分裂的CSS：

#hero { 
float: right; 
border-top: 1px solid #FFF; 
width: 725px; 
height: 370px; 
background: #666; 
} 

#wave { 
width: 970px; 
height: 40px; 
position: absolute; 
left: 0; 
bottom: 0; 
background: url(../img/wave.png) no-repeat bottom left; 
}

來源

2011-10-14 tejinderss

哪裏是你的HTML代碼？所有的瀏覽器，或只是一個？ – Sparky

'Z-index'變化？ – Orbling

http://dpaste.com/634461/ – tejinderss

週期插件使用的z-index，很可能你的問題的根源。從循環插件代碼：

// set position and zIndex on all the slides 
    $slides.css({position: 'absolute', top:0, left:0}).hide().each(function(i) { 
     var z; 
     if (opts.backwards) 
      z = first ? i <= first ? els.length + (i-first) : first-i : els.length-i; 
     else 
      z = first ? i >= first ? els.length - (i-first) : first-i : els.length-i; 
     $(this).css('z-index', z) 
    });

我會玩「波」的Z指數，看看是否沒有幫助。

#wave { 
width: 970px; 
height: 40px; 
position: absolute; 
left: 0; 
bottom: 0; 
background: url(../img/wave.png) no-repeat bottom left; 
z-index: 99; 
}

來源

2011-10-14 16:50:28 mikey

謝謝，我想通過upvoting向你展示我的讚賞，但是stackoverflow不會讓我。再次感謝。 – tejinderss

@ user867365你可以「接受」答案來表示你的讚賞。 –

位置從相對於絕對（由循環插件）改變，導致z-index變化如@Orbling所述。如果您希望邊界位於旋轉器中的圖像的頂部，則可以絕對或相對地定位它們併爲它們指定一個高於容器的z-index。

要解決：明確定位較低的波浪形「邊界」元素（position:relative; or position:absolute;) *，並給它的z-index比旋光器元件的高

*給元素較高的Z-指數比肩。將不行如果元素沒有被明確定位。看到http://www.webdevout.net/test?0_

來源

2011-10-14 17:05:43

非常感謝這些信息。 – tejinderss

+1由於顯而易見的原因和正確的。 ;-) – Orbling

問題與jQuery週期插件

回答

相關問題