Article Topic Learning Download Q&A Programming Dictionary Game Recent Updates

简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)

Home > Web Front-end > HTML Tutorial > body text

The css background image is loaded first and then rendered. I hope everyone will take a look_html/css_WEB-ITnose

WBOY

Release： 2016-06-24 12:11:27

Original

2283 people have browsed it

I have three background images, but because the x and y axes have to be tiled, I can’t use css sprites. However, I want these three background images to be displayed at the same time, either not displayed or displayed at the same time. So I want to load these three images first and then start css rendering. How can this be done?
Thank you everyone ~

Reply to the discussion (solution)

<!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>

Copy after login

For reference.

HTML code

> ">

…
Well, although it doesn’t work, I still thank you (*^__^*) Hehe...

Related labels：

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

source：php.cn

Previous article：Unable to load CSS code_html/css_WEB-ITnose View details mean_html/css_WEB-ITnose"> Next article：What does View details mean_html/css_WEB-ITnose

Statement of this Website

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn