我们遇到一个angularJS应用程序的问题,其中从不同的服务器加载了几个背景图像。我们这样做是因为取决于访问该网站的用户将取决于显示的品牌形象。
所有浏览器中的一切看起来都很棒,除了不显示背景图像的Safari。我已经用尽了我所知道的每一个技巧,所以我在这里寻求支持,希望这个问题可能在此之前出现过。这是应用程序的URL: http://newux.unicas.com/applicant-ux/#/login/
这是用于背景图像的css:
.cas-login-header .cas-org-logo, .cas-app-header .cas-org-logo {
background-image: url('/applicant-ux/api/resources?image=OptomCAS.png');
background-size: cover;
height: 62px;
width: 562px;
}
角度代码是:
$rootScope.setThemeCss = function(){
var themeResource = resourceFactory.init({
resourceUri: "/applicant-ux/api/css/themecss"
});
var retrieveHandler = function(response) {
var header = document.getElementsByTagName('head')[0];
var previousStyle = document.getElementById('branding');
if(previousStyle){
header.removeChild(previousStyle);
}
var style = document.createElement('style');
style.type = 'text/css';
style.innerHTML = response.data.css;
style.id='branding';
document.getElementsByTagName('head')[0].appendChild(style);
Session.set("css",response.data.css);
};
pageContent.get(function() {
return themeResource.retrieve();
}).then(retrieveHandler);
};