JavaScript：一段时间后更改 div 背景答案

【问题标题】：JavaScript: Change Div Background After TimeJavaScript：一段时间后更改 div 背景
【发布时间】：2011-09-24 17:37:59
【问题描述】：

我的网站上有一个广告部分。对于大多数用户来说，这可以正常加载并按预期工作。但是，如果用户有某种广告拦截器，则广告不会显示，并且会显示网站的空白区域。

我的解决方案？我想在广告下方放置一个背景图片，要求用户考虑仅在此站点上启用广告。此图像不显眼，并让用户选择是否支持他们正在访问的站点。通过简单的 CSS，我可以很好地完成这项工作（只需使用 background-image 就可以了）。

问题是加载广告需要一点时间（对于某些用户来说大约需要一秒钟左右）。我不希望在广告有机会加载之前显示此背景图像，因此我想在一定时间（可能是 2-3 秒）后更改 div 的背景。

这是我目前对 JavaScript 函数的尝试：

<script type="text/javascript">
function show_banner(){
    document.getElementById('banner').style.background="url('images/banner_bg.png')";
}
function show_banner_delay(){
    setTimeout("show_banner()", 3000);
}</script>

这是 HTML 代码：

<div id="banner-wrap">
    <div id="banner">
        <!--Google AdSense Code Here-->
    </div>
</div>

我觉得我可能只是在这里遗漏了一些基本语法，但我似乎无法弄清楚！

感谢您的帮助！！！

【问题讨论】：

什么时候调用 show_banner_delay()？尝试删除 () 以及
那么，你是否建议我这样做：window.onload = setTimeout("show_banner", 3000);
我也实现了您的更改，但总体上使用了 Ravan 的代码。感谢您的帮助！
任何使用广告拦截器的人几乎肯定也可以拦截图片（它是 Adblock Plus 的内置功能），因此他们也可能会拦截它。 :-(

标签： javascript css time background-image adsense

【解决方案1】：

删除 show_banner_delay 函数。测试一下：

function show_banner(){
    document.getElementById('banner').style.backgroundImage="url('images/banner_bg.png')";
}

window.onload = function() {
   setTimeout(show_banner, 3000);
};

【讨论】：

【解决方案2】：

试试这个：setTimeout(show_banner, 3000);

此外，除非您要更改背景的其他属性，否则仅将...style.background = url... 更改为...style.backgroundImage = url...。

【讨论】：

我也实现了您的更改，但总体上使用了 Ravan 的代码。感谢您的帮助！