I have a problem in using .htc file, so I use js version in my project.
But I need it dynamicly, let's see how I did it.
source code
if(typeof(window.PIE.dynamic)=='undefined') window.PIE.dynamic = {
inlineCSS: '*',
stylesheets: true,
trackChangesFor: '*',
bindChangeEvent: function(query) {
$(query).unbind('propertychange').bind('propertychange', function(e) {
if(/borderradius|boxshadow|borderimage|piebackground/gi.test(e.originalEvent.propertyName)){
PIE.dynamic.refresh(this);
}
});
},
resolveCSSKey: function(style) {
return style['border-radius']
|| style['box-shadow']
|| style['-pie-background']
|| style['border-image'];
},
parseStylesheets: function(styleSheets) {
//Loop through all stylesheets and apply initial rules
for (var i=0; i < styleSheets.length; i++) {
for (var j=0; j < styleSheets[i].rules.length; j++) {
if(PIE.dynamic.resolveCSSKey(styleSheets[i].rules[j].style)){
PIE.dynamic.refresh(styleSheets[i].rules[j].selectorText);
}
}
if(styleSheets[i].imports.length>0){
PIE.dynamic.parseStylesheets(styleSheets[i].imports);
}
};
},
refresh: function(selector) {
$(selector).each(function(){
PIE.attach(this);
});
}
}
$(function(){
if(!$.browser.msie)return;
else if(parseFloat($.browser.version)>8)return;
if(PIE.dynamic.stylesheets)PIE.dynamic.parseStylesheets(document.styleSheets);
if(PIE.dynamic.inlineCSS){
$(PIE.dynamic.inlineCSS === true ? '*' : PIE.dynamic.inlineCSS).each(function() {
if(PIE.dynamic.resolveCSSKey(this.style))PIE.dynamic.refresh(this);
});
}
if(PIE.dynamic.trackChangesFor)PIE.dynamic.bindChangeEvent(PIE.dynamic.trackChangesFor);
});
example
try to run this link on ie<9 http://jsfiddle.net/FUCQV/
No comments:
Post a Comment