2011-06-06 94 views
1

我使用jQuery-cycle爲我的一個幻燈片供電並且應用於容器div的border-radius屬性無法按預期工作:「View Content 「幻燈片有圓角,其他幻燈片沒有任何。jQuery-Cycle:border-radius屬性在Chrome 11中沒有像預期的那樣運行

#carousel {-webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px;} 

我的循環初始化代碼:

$('#carousel').cycle({ 
     speed: 400, 
     startingSlide: 1, 
     speedIn:null, 
     speedOut:null, 
     cleartype: false, 
     fit:1, 
     width:980, 
     delay: 0, 
     timeout:0, 
     fx: 'scrollHorz', 
     easing: 'swing', 
     easeIn:null, 
     easeOut:null, 
     prev: '#left', 
     next: '#right', 
     pager: '#pager', 
     pagerAnchorBuilder: function (idx, slide) {   
     return('<span><b>0'+slide.id+'</b>/07</span>');  
     }, 
     updateActivePagerLink: function(pager, activeIndex) { 
       if(activeIndex==0){ 
       $('#navigation').hide(); 
       $('#bottombar').css({'margin-top':'22px'}); 
       } 

       else if(activeIndex==1){ 
       $('#left').hide(); $('#right').show(); 
       $('#bottombar').css({'margin-top':'540px'}); 
       } 

       else if(activeIndex==7){ 
       $('#left').show(); $('#right').hide(); 
       $('#bottombar').css({'margin-top':'540px'}); 
       } 
       else 
       { 
        $('#right').show();$('#left').show(); 
        $('#bottombar').css({'margin-top':'540px'}); 
       }    $('#pager').find('span:eq('+activeIndex+')').addClass('activeSpan').siblings().removeClass('activeSpan'); 
          } 


}); 

演示:http://rjwcollective.com/equinox/brochure/

+0

請描述你所期望的和實際的結果從什麼不同。 – Sparky 2011-06-06 21:54:18

+0

嘿斯帕克,我沒有在旋轉木馬容器上得到圓角。在這個例子中,http://rjwcollective.com/equinox/brochure/點擊左下角的「查看內容」。那張幻燈片有圓角。不知道我做錯了什麼。 – frishi 2011-06-06 21:57:37

+0

你也應該發佈你的HTML代碼......你發佈的JavaScript與討論的DIV的CSS無關。 – Sparky 2011-06-06 22:04:50

回答

1

你實際上是變圓了你的#carousel格角(您可以通過添加對#carousel紅色邊框測試這個)。你沒有看到它的原因是因爲圖像是絕對定位的並且沒有圓角。

如果你想顯示的圓角,添加此規則,以你的樣式表:

.carousel_cont { 
    padding: 15px 0px; 
} 
+0

謝謝基。這工作! – frishi 2011-06-06 22:16:58

相關問題