1

我有一个在 IE9 和 Firefox 中运行良好的 JavaScript，但在 Chrome 中却不行。我想要一些建议来解决这个问题。

我正在尝试一个很酷的技巧来绕过我从http://www.bram.us/sandbox/roundedcorners/学到的图像的角落。我更新了我的 css 并在上面的站点中包含了 javascript，但实际上所有图像在 Chrome 上都消失了，而其他两个浏览器按预期呈现圆角。

我知道这个脚本也适用于 Chrome，因为http://www.bram.us/sandbox/roundedcorners/在 Chrome 上运行良好。

这是javascript。

jQuery(function($) {
    $('img').wrap(function() {
        return '<span style="background-image:url(' + $(this).attr('src') + '); height: '+ $(this).height() + 'px; width: '+ $(this).width() + 'px;" class="rounded" />';
    });
});

提前致谢！！

4

2 回答 2

1

Chrome 对使用 CSS 舍入图像有很好的原生支持。我建议在这里避免使用 JavaScript，而是使用以下内容：

img {
    -webkit-border-radius: 12px; /* Saf3-4, iOS 1-3.2, Android ≤1.6 */
    border-radius: 12px;         /* Opera 10.5, IE9, Saf5, Chrome, 
                                    FF4+, iOS 4, Android 2.1+ */
}

以上内容可在css3please.com上找到。

于 2012-05-30T13:13:34.913 回答
1

你确定你没有忘记在你的.rounded课程中包含任何这些吗？

-webkit-border-radius

border-radius

display: block或者display:inline-block

于 2012-05-28T17:18:02.800 回答