文章/答案/技术大牛

发布

社区首页 >问答首页 >用javascript添加CSS渐变- IE7中的bug

问用javascript添加CSS渐变- IE7中的bug
EN

Stack Overflow用户

提问于 2010-12-21 02:15:36

回答 1查看 622关注 0票数 0

我试图只在.link.box.gradient上添加渐变，但在ie7中它添加了.link.box.gradient和.style.box.gradient

<!DOCTYPE html>
<html lang="sv">
    <head>
    <title></title>
        <script src="http://ajax.microsoft.com/ajax/jQuery/jquery-1.4.4.min.js"></script>
        <script>
            jQuery(function ($) {
                $('head').append("<style>.link.box{height:100px;width:100px;}.link.box.gradient{filter:progid:DXImageTransform.Microsoft.gradient(startColorStr='#000000',EndColorStr='#ffffff');}</style>");
            });
        </script>
    </head>
    <body>
        <div class="style box gradient">Gradient (style-tag)</div>
        <div class="link box gradient">Gradient (link-tag)</div>
    </body>
</html>

你也可以在这里看到，有一件奇怪的事情是，当我从javascript中移出高度{.link.box:100px；http://jsfiddle.net/Zhvpy/1：100px；}时，你可以在这里看到，它似乎可以工作，但我不想搬出去。

为什么会这样呢？我该如何修复这个bug呢？

javascript

css

selector

explicit

internet-explorer-7

回答 1

Stack Overflow用户

回答已采纳

发布于 2010-12-21 02:33:13

删除了原始的错误答案

编辑1个

奇怪的是，它可能是老版本的IE处理某些元素(如<script />)的方式，所以尝试了a non-jQuery solution。似乎起作用了！

编辑2个

将此添加到您的完整脚本-输出不同的结果，这与IE8输出的内容更一致

function appendStyle(element, cssObj) {
    //$('#a').append($('<span/>').text(cssObjToText(cssObj)));
    if ($.browser.version == 7) {
        var head = document.getElementsByTagName('head')[0],
            style = document.createElement('style'),
            rules = document.createTextNode(cssObjToText(cssObj));

        style.type = 'text/css';

        head.appendChild(style);

        style.styleSheet.cssText = rules.nodeValue;
    }
    else {
        element.after('<style class="css-finalized">' + cssObjToText(cssObj) + '</style>');
    }
}

票数 2

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/4492545

复制

相似问题

问用javascript添加CSS渐变- IE7中的bug
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问用javascript添加CSS渐变- IE7中的bugEN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问用javascript添加CSS渐变- IE7中的bug
EN