最近用PIE.htc开发CSS3的网页时,发现用到PIE.htc的CSS效果对于用脚本生成的html代码都无效的情况
众所周知htc是IE针对CSS开放的一种特殊实现方式
htc的实现是在页面载入完成后开始的,类似于js的window.onload(),它并不是像CSS语言那样,成为浏览器原生的语言,所以当页面内容使用js生成时,其他css效果都会展现,唯独htc的效果不会出现,因为此时它已经过了执行时间了
因此,需要让htc效果继续出现,就要用js操纵一次,让htc再次执行一遍。
IE为此专门为DOM节点添加了一个addBehavior方法,用于执行htc文件的。
具体使用方法如下:
原本的CSS代码:
#b {
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
behavior: url(/PIE.htc);
}
插入html并使htc执行的jQuery代码:
$(window.body).append('<div id="b"></div>');
$('#b').get(0).addBehavior('/PIE.htc');
// 或 document.getElementById('b').addBehavior('/PIE.htc');
建议在执行addBehavior前,先判断下浏览器是否支持该方法,如:
if(window.body.addBehavior){
document.getElementById('b').addBehavior('/PIE.htc');
}
标签:htc,PIE,window,html,radius,addBehavior,CSS
From: https://blog.51cto.com/u_16237557/7260844