ホームページ > 記事 > ウェブフロントエンド > CSS 背景画像が最初に読み込まれてからレンダリングされます。_html/css_WEB-ITnose をご覧ください。
CSS 背景画像が最初に読み込まれてからレンダリングされます。_html/css_WEB-ITnose をご覧ください。
- WBOYオリジナル
- 2016-06-24 12:11:272289ブラウズ
背景画像が 3 つありますが、X 軸と Y 軸を並べて表示する必要があるため、CSS スプライトは使用できません。ただし、この3つの背景画像は表示されないか、同時に表示されるようにしたいのです。したがって、最初にこれら 3 つの画像をロードしてから CSS レンダリングを開始したいと思います。これはどうすればできるのでしょうか?
皆さんありがとうございます〜
ディスカッションへの返信(解決策)
<!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> 参考までに。 HTMLコード＆lt;
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。