-webkit-background-size 不适用于 jQuery Css
[英]-webkit-background-size doesn't work with jQuery Css
问题描述
I am trying to load a background after the page loads but it seems it does not work as I expect.
我试图在页面加载后加载背景，但它似乎不像我预期的那样工作。
My code before in css was:我之前在 css 中的代码是：
html {
background: url(<?php echo $this->Cdn->getUrl(); ?>/images/photos/bg-blurred.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
background-color: #0c1d31;
}
Now I try it with jQuery:现在我用 jQuery 试试：
jQuery(document).ready(function () {
jQuery('html').css({
'background-image': "url('<?php echo $this->Cdn->getUrl(); ?>/images/photos/bg-blurred.jpg')",
'background-size': "cover",
'background-color': "#0c1d31",
'-webkit-background-size': "cover",
'-moz-background-size': "cover",
'-o-background-size': "cover",
});
});
It seems the '-webkit-background-size' and '-moz-background-size' and '-o-background-size' are not working using jQuery.css.似乎“-webkit-background-size”和“-moz-background-size”和“-o-background-size”在使用 jQuery.css 时不起作用。 The other css properties works fine.其他 css 属性工作正常。
Any ideas please?请问有什么想法吗？
2 个解决方案
解决方案1
1 2016-04-02 20:02:53
If you try with only "-webkit-background-size":如果您仅尝试使用“-webkit-background-size”：
jQuery(document).ready(function () {
jQuery('html').css({
'-webkit-background-size': "cover"
});
});
You'll see that your element will look like this:你会看到你的元素看起来像这样：
<html style="background-size: cover;">
So this is not your issue.所以这不是你的问题。
You should probably look for your url:您可能应该查找您的网址：
"url('<?php echo $this->Cdn->getUrl(); ?>/images/photos/bg-blurred.jpg')"
If you are using chrome, check in f12 inside the Network's tab, to see if there's not an error.如果您使用的是 chrome，请检查网络选项卡内的 f12，以查看是否有错误。
解决方案2
0 已采纳 2016-04-02 20:40:07
Sorry it was my mistake.对不起，这是我的错误。 I miss some code in my JS...我想念我的 JS 中的一些代码...
jQuery('html').css({
'background-image': "url('<?php echo $this->Cdn->getUrl(); ?>/images/photos/bg-blurred.jpg')",
"background-repeat": "no-repeat",
"background-position": "center center",
"background-attachment": "fixed",
'background-size': "cover",
'background-color': "#0c1d31",
'-webkit-background-size': "cover",
'-moz-background-size': "cover",
'-o-background-size': "cover",
});
Is good.很好。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.