Question

这是我的jQuery函数，它取代了CSS文件

function BallyChangeTheme(theme) {
    var links = $("link");
    var _t = theme;
    $.each(links, function (i, link) {            
        var _h = $(link).attr('href');
        _h1 = _h.replace(/T.*e[0-9]/, _t);
        if (_h1 !== _h) {               
            $(link).attr('href', _h1);                
        }
    });
}

有15个链接元素！更换css文件后转换不顺畅。当用户选择更改主题时，知道如何提供流畅的用户体验吗？

Answer 1

正如@ rory-mccrossan所说，将所有CSS放在同一个文件中，但是在主体上的不同顶级类下限定，如：

HTML

<body class="style-a">
    <a href="" class="btn" title="Toggle styles">Toggle styles</a>
</body>

CSS

.style-a {
    a {color: red;}
}
.style-b {
    a {color: blue;}
}

JS

$('.btn').on('click', function(e) {
    e.preventDefault();
    $('body').toggleClass('style-a').toggleClass('style-b');
});

当我们动态更改css文件时，如何避免无格式的内容闪存？

1 个答案: