多くの場合、背景にアップロードされた後に写真が変形されるという問題に遭遇します。ウェブサイトのスタイルが適切な場合は、この方法を使用してページをレイアウトして、あらゆるサイズの画像スライディング（上、下、左、右）をサポートできます。
<！ Doctype html> <html> <head> <meta http-equiv = "content-type" content = "text/html; charset = utf-8"/> <title>任意のサイズのスライド</title> <style> div {margin：0 auto;オーバーフロー：hidden;}。main {width：1000px;}。divmg_div1{width：380px;フロート：左;}。divmg .div4_title {width：380px;高さ：103px;バックグラウンドカラー：＃edb205;色：#fff;フォントファミリー：「Microsoft Yahei」;フォントサイズ：22px; font-weight：bold;ラインハイト：90px;テキストアライグ：センター;文字間隔：5px;}。divimg_img1 {width：380px;高さ：414px;マージントップ：5px;バックグラウンドカラー：#fff;位置：相対;}。divimg_div2 {width：615px;フロート：右;}。divimg_img2 {width：194px;高さ：256px;フロート：左;バックグラウンドカラー：#fff;位置：相対;}。divimg_img3 {width：417px;高さ：256px;フロート：そうです;バックグラウンドカラー：#fff;位置：相対;}。divimg_img4 {width：366px;高さ：262px;フロート：左;マージントップ：4px;バックグラウンドカラー：#fff;位置：相対;}。divimg_img5 {width：245px;高さ：262px;フロート：そうです;マージントップ：4px;バックグラウンドカラー：#fff;位置：相対;}。左：50％;トップ：50％;マージン左：-50px;マージントップ：-50px; z-index：2;}。 z-index：1;左：0;上：0;表示：なし;} </style> <script src = "js/jquery-1.10.2.min.js"> </script> <script> $（document） hh = $（this）.parent（）。height（）; var ww = $（this）.parent（） rept（）{$（this）.animate（{left ：-( parseint（hh）/h*w） - （parseint（ww））}、10000、右）} function right（）{$（this） top（）{$（this）.animate（{top ：-( parseint（ww）/w*h） - （parseint（hh））}、10000、bottom）;} function botton（）{$（this）.animate（{top：0}、10000、top）;} if（blw> blh）{$（this）.height（hh）.width（parseint（hh）/h*w））; $（this）.prev（）。 $（this）.animate（{left ：-( parseint（hh）/h*w） - （parseint（ww））}、10000、右）;} else if（blw < blh）{$（this）.height（parseint（parseint（ww）/w*h）） splay "：" block "}）; $（this）.animate（{top ：-( parseint（ww）/w*h） - （parseint（hh））}、10000、bottone）;}}）; $（"。div4 .img "）。各（function（index、element）{$（this）.attr（" src "、$（this）.attr（" name "）;}）;}）; </script> </head> <body> <div> <div> <div> <div>任意のサイズのスライド</div> <div> <img src = "images/loadding.gif"/> <img name = "image/am_bigimg01.jpg" src = "" ""/>> </div> div div div div> <div> <> <> <img src name = "Images/am_nyimg01.jpg" src = ""/> </div> <div> <img src = "images/loadding.gif"/> <img name = "image/am_img02.jpg" src = ""/> </div> <div> <img = "/loadding.gif"/<img name = "images/am_newimg01.jpg" src = ""/> </div> <div> <img src = "mights/loadding.gif"/> <img name = "image/am_rynewimg03.jpg" src = "" "/> </div> </div> div> </bid> </bid> </html>