Вы правы, относительные пути URL в стиле фона приведут к появлению этого сообщения в IE6 / 7.
Единственный метод, который я успешно использовал, - это либо построить абсолютный путь из доступных данных браузера, либо жестко закодировать абсолютный путь. Вот пример того, как вы можете построить абсолютный путь с помощью JavaScript:
Использование определения стиля верхнего уровня, например:
<style type="text/css">
.fixBgImage {
background: url(/images/imagename.jpg);
}
</style>
Вы можете использовать функцию JavaScript, которая ищет это правило и изменяет стиль backgroundImage для этого правила. (Имейте в виду, что в этом примере предполагается, что вы определили правило на листе [0])
// this function needs to be run after the page has loaded
// (body.onload, window.onload or something similar)
function fixBackgroundImages() {
// using sheet 0 defined first on this page
var rule = getRule('.fixBgImage', document.styleSheets[0]);
if (rule != null) {
var bgUrl = rule.style.backgroundImage.replace(/^url|[\(\)]/g, '');
bgUrl = fixHttpsBgUrl(bgUrl);
rule.style.backgroundImage = 'url("' + bgUrl + '")';
}
}
function getRule(name, sheet){
var rules = (sheet.rules) ? sheet.rules : sheet.cssRules;
for (var i = 0; i < rules.length; i++) {
if (rules[i] && rules[i].selectorText == name) {
return rules[i];
}
}
return null;
}
// This function returns an absolute path if https is used
function fixHttpsBgUrl(imgUrl){
if (document.location.protocol.indexOf('https') >= 0){
var basepath = document.URL.substring(0, document.URL.lastIndexOf('/') + 1);
var pcol = document.location.protocol + '//';
var host = document.location.hostname;
var port = (document.location.port) ? ':' + document.location.port : '';
if (imgUrl.indexOf('/') == 0){ // server root path
imgUrl = pcol + host + port + imgUrl;
}
else{ // app root
imgUrl = basepath + imgUrl;
}
}
}