NIVO滑块圆角问题

Question

请访问my site。

如果您查看我的滑块，您会发现第一张幻灯片是完美的，但所有其他幻灯片只在图像底部有白色角落。

我无法弄清楚这一点！我最初通过给切片圆角来解决问题，但是过渡效果会使图像看起来像是圆角切片。

有人可以在这里提出建议吗？这让我发疯了！

Answer 1

看起来问题出在class属性设置为“nivo-slice”的元素中。可能这个代码片段可以解决问题：

.nivo-slice { 
    -moz-border-radius: 9px; 
    -webkit-border-radius: 9px; 
    border-radius: 9px; 
    ... 
}

Answer 2

这个修改过的Nivo Slider脚本是您可能正在寻找的： http://web3o.blogspot.com/2011/02/jquery-nivo-slider-with-css3-round.html

Answer 3

.nivoSlider {
    position:relative;
    -moz-border-radius: 5px; 
    -webkit-border-radius: 5px; 
    border-radius: 5px;     
}

这可能会有所帮助。适合我！

Answer 4

我找到了解决方案，但它确实需要与NivoSlider进行一些妥协。我能让它工作的唯一方法就是让滑块中只有1个切片，这取决于你的视角是否可行。

然后你只需将border-radius应用于nivo-slice和滑块包装元素，你就可以开展业务了。这也适用于CSS3PIE，因此我能够与它进行跨浏览器兼容。