js は画像を比例的に拡大縮小します。Web ページが比較的大きな画像を読み込むと、Web ページが変形してページが醜くなることがよくあります。そこで、JS を使用して画像を一定の範囲を超えて制御することを考えました。 , Script House はページ レイアウトを安定させます。このコード スニペットはこの機能を完成させます。コードは非常に簡潔で、効果は非常に優れています。
< ;title> 画像を比例的に拡大縮小します<script>function <br>DrawImage(ImgD,iwidth,iheight){ //パラメータ (画像、許容される幅、許容される高さ) <br>var <br>image=new Image(); image.src=ImgD.src; <br>if(image.width>0 <br>&& image.height>0){ if(image.width/image.height>= <br>iwidth/iheight ){ if(image.width>iwidth){ <br>ImgD.width=iwidth; <br>ImgD.height=(image.height*iwidth)/image.width; <br>ImgD. width=image.width; <br>ImgD.height=image.height; <br>} <br>}else{ <br>if(image.height>iheight){ <br>ImgD.height=iheight; >ImgD.width=(image.width*iheight)/image.height; <br>ImgD.width=image.width; <br>ImgD.height=image.height; 🎜>} <br>} <br>} <br></script>
src=http://www.jb51.net/uploadfile /2013/0803/20130803034531502.jpg"
alt="自動スケーリング後の効果"
width="100"
height="100"
onload ="javascript:DrawImage(this,80,80)"
/>