css背景图片 先加载完成 后渲染 问题，希望大家看看

我有三张背景图片，但是，因为x和y轴都要平铺，所以不能用css sprites。但是，我想这三张背景图片 同时 显示，要么不显示，要么同时显示。所以 我想要先加载完 这三张图片，再开始 css的渲染。怎么样才能做到呢？
谢谢大家~

解决方案 »

  1.   


    <!DOCTYPE HTML>
    <html>
        <head>
            <meta charset="gb2312" />
            <title></title>    </head>
        <body>
            <div id="test" style="width:120px; height:120px;"></div>
            <script>
    function $(el){
    return typeof el == 'string' ? document.getElementById(el) : el;
    }

                var img = new Image;
    img.src = 'http://avatar.profile.csdn.net/D/2/3/2_yiqiejieruying.jpg';
    img.onload = function(){
    $('test').style.backgroundImage = 'url('+img.src+')';
    }
            </script>
        </body>
    </html>楼主 参考下
      

  2.   

     function $(el){
                    return typeof el == 'string' ? document.getElementById(el) : el;
                }
                
                var img = new Image;
              
                img.onload = function(){
                    $('test').style.backgroundImage = 'url('+img.src+')';
                }  
    img.src = 'http://avatar.profile.csdn.net/D/2/3/2_yiqiejieruying.jpg';先设置 onload  ,再设置 src
      

  3.   

    恩，这个我试过，不过在ie下会报错，而且这个只能设置一张图片加载完成时用，当我设置三张图片都加载完成的时候就报错了，错误有‘还未实现’等，记不清具体是什么了，用ie9的开发者工具调试的，反正我是还不能做到三张图片都加载完后再开始css的渲染，一张的话就行……
      

  4.   

    我还试过用空的div加载背景图像，可是结果是，无论div的顺序是什么，都是，没下载完一张图片，ie就全局显示设置了这张背景的div，所以还是不能做到三张图片 同时显示
      

  5.   

    还是给你看看我的博客吧，我用了8个标签和三张小图片做了ie下的自适应阴影，可是我想更好一点，所以就想这三张图片一起显示，不然开始的时候阴影不完全，感觉不好。在ie9以上的话直接css3阴影就搞定了。这个不说了。
    我的博客是 fengcen.net,还没有完成的，要学习，暂时没时间
      

  6.   

    三个目标元素设置默认style为display:none;，再等window.onlode触发时修改display样式呢？