0

ulwith がありborder-radius: 10px; overflow:hidden、その中に複数liの があります。

通常、ulコーナーは内側のコンテンツを隠します。しかし、Chrome では、jQuery を使用してlis をアニメーション化 (フェード) すると、アニメーション中にli角が表示されます。

アニメーションが完了すると、 の角liが非表示に戻ります。

これを防ぐにはどうすればよいですか?

これは、Webkit ブラウザー (Chrome および Safari) でのみ発生します。

HTML :

<ul>
    <li>Text</li>
    <li>Text</li>
    <li>Text</li>
</ul>

CSS :

ul {
    border-radius: 10px;
    overflow: hidden;
}
4

1 に答える 1

0

これを試すことができます：

// give specific border-radius to first ans last li
$('li:first').css('border-radius', '0 10px 0 0');
$('li:last').css('border-radius', '0 0 10px 0');

注CSS を使用することもできます

デモはサンプルアニメーションを示しています

于 2012-05-13T17:54:08.560 に答える