<strong> 背景画像戦略を提供します。 </strong> <br><br>1、背景画像は固定されます <br><br>2、ウィンドウ サイズの変化に応じてサイズも変化します <br><br>3、比率は変更されません。ズーム <br><br> はブラウザをサポートします: IE 6、7、8、9、FF、Chrome <br><br>デモ アドレス: http://www.einino.net/bg_image.html <br><div class="codetitle"> <span><a style="CURSOR: pointer" data="8933" class="copybut" id="copybut8933" onclick="doCopy('code8933')"><u>コードをコピーします</u></a></span> コードは次のとおりです。</div> <div class="codebody" id="code8933"> <br><style>body{margin: 0;padding:0 ;height:2000px; } <br>#background_img{ <br>top:expression(documentElement.scrollTop); /*上部を固定するにはこの式が必要です*/ <br>} <br>< /style> <br><br> </div> <br><div class="codetitle"><span><a style="CURSOR: pointer" data="647" class="copybut" id="copybut647" onclick="doCopy('code647')">コードをコピー<u></u></a> コードは次のとおりです:</span></div> <div class="codebody" id="code647"> /**<br>*@desc 固定背景画像を作成します。画像の比率を失わずに、ウィンドウ サイズに合わせて画像のサイズを変更します <br>*@author EI Nino <br>*2013/8/15 <br>*/ <br>var imgBackground=function(_img_obj) <br>{ <br>this.img = _img_obj; <br>this.init() <br>} <br>imgBackground.prototype ={ <br>init:function (){ <br>this.img.style.top="0"; <br>this.img.style.left="0"; IndexOf('MSIE 6.0')> ;0){ <br>this.img.style.position="absolute"; <br>this.img.style.bottom="auto"; body.style.backgroundImage){/ /esacpe IE 6 でウィンドウをスクロールするときにフラッシュします <br>document.body.style.backgroundImage="url(about:blank)"; <br>document.body.style.backgroundAttachment= "修正済み"; <br>} <br>} <br>else{ <br>this.img.style.position="修正済み"; <br>this.ra = this.img.width/this .img.height; <br> this.resize(); <br>}, <br>resize:function() { <br>var self=this; (document.documentElement.clientWidth /document .documentElement.clientHeight )>=self.ra) <br>{ <br>self.img.style.width=document.documentElement.clientWidth "px"; .style.height=""; <br>} <br>else{ <br>self.img.style.width=""; <br>self.img.style.height=document.documentElement.clientHeight "px" ; <br>} <br> }, <br>GetStyle:function(_obj,_style){ <br>var obj = _obj; <br>return obj.currentStyle[_style] :window.getComputedStyle(obj) , null)[_style]; <br>}, <br>BindEvent:function(){ <br>var self = this; jquery lib <br>を使用します。 >self.resize(); <br>} <br>}; new imgBackground(document.getElementById("background_img"));</div>