Question

我想从我的数据库中获取图像，并将其用作背景。这是微不足道的，但有一种比我目前的方法更好/更快的方式。

目前，我使用Javascript（在<head>中）加载我的背景图片，因为我的CSS是链接的而不是内部的：

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type='text/javascript'>
    $(document).ready(function(){
        $('body').css('background', 'url(/_images/galleries/lg_<?php echo getBackgroundImage(); ?>) no-repeat top center white');
    });
</script>

加载页面后，加载背景大约需要半秒钟。我假设延迟可以归因于加载外部JS等。此外，上面的代码作为一个组件包含在内，这样我就不必在网站的每个页面中复制/粘贴该代码。 <body>未包含在此附带组件中。

是否有更快和更好的方法？

Answer 1

由于您要在文档中添加脚本，因此您可以使用所需的CSS添加<style>块。

Answer 2

我看到这已经得到了回答......

我认为延迟可归因于加载外部JS

是。默认情况下是Javascript块。虽然有ways around this，但它们依赖于推迟加载javascript。并且你仍然需要等待javascript加载才能加载图形以放入后台。使用j08691的方法避免了这个问题，但是如果你希望脚本更快，那么CSS文件中的inline the image data（你可以在HTML中进行，但是然后通过缓存html来限制图像的缓存 - 通常CSS文件将更加缓存。当然，如果你想支持旧版浏览器，那么你需要一个Varies：User-agent标头和不兼容浏览器的不同代码。

以编程方式编写CSS背景的最佳方法？

2 个答案: