如何在页面加载时显示CSS加载程序?

时间:2014-05-21 15:06:23

标签: javascript loader

我正在尝试在内容加载时在网站上显示一个CSS加载程序。我正在使用此工具来创建加载器:http://cssload.net/

我的一些网页确实有很多标签,在用户与网站互动之前必须加载内容。我不知道为了让这台装载机出现我需要寻找什么。

我想我必须使用.onload()JavaScript?

2 个答案:

答案 0 :(得分:0)

您需要切换包含gif的图片代码的可见性。只需简单地显示图像,加载页面时,隐藏图像。

示例演示:http://jsfiddle.net/GCu2D/140/

$(document).ready(function () {
    $('a').click(function(){
        $('img').toggle();
        return false;
    })
});

这是一个jQuery代码,尽管你可以在javascript中做同样的事情。相应地将display设置为noneblock

答案 1 :(得分:0)

将加载程序放在页面上所有其他元素的顶部,并为其添加id'加载程序'例如,试试这个:

document.addEventListener('DOMContentLoaded', onReady, false);
function onReady()
{
    var loader = document.getElementById('loader');
    loader.style.display = 'none';
}

注意:这不适用于IE< 9