jQuery附加CSS文件并等待直到应用样式而没有setInterval吗? [英] jQuery Append CSS File and Wait until styles are applied without setInterval?
问题描述
我通过以下方式加载CSS:
I load CSS by:
$('head').append('<link rel="stylesheet" href="style2.css" type="text/css" />');
它可以工作，但是我有一个功能需要在应用CSS之后运行，并且我不想使用setInterval.
It works, but I have a function that needs to run after the CSS has been applied, and I don't want use setInterval for it.
我该怎么做?
推荐答案
一种解决方案，如果您可以访问正在加载的css文件，
是使用 transitionend 事件并激活从CSS转换为duration设置为0.1的过渡.
One solution, if you've got access to the css file you're loading,
is to use the transitionend event, and to activate a transition, with duration set to 0.1, from your css.
就像这样，您确定CSS已经计算完毕.
Like so, you are sure the CSS has been calculated.
style2.css
body{opacity:1;}
index.html
<style>
body{transition : opacity 0.1s linear; opacity:.9};
</style>
<body>
...
<script>
document.body.addEventListener('transitionend', function(){
alert('done');
}, false);
$('head').append('<link rel="stylesheet" href="style2.css" type="text/css" />');
对于需要js函数的文件(没有外部文件): https://jsfiddle.net/t0akchuw/
For the ones that would need a js function (without external files) : https://jsfiddle.net/t0akchuw/
这篇关于jQuery附加CSS文件并等待直到应用样式而没有setInterval吗?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
