比較的小さな画像の場合、画像の上にマウスを移動すると表示が拡大されます。つまり、画像表示のサイズが拡大されてブラウザの指定された位置に配置され、拡大プレビューが表示されます。写真の。コードは次のとおりです。 コードをコピーします コードは次のとおりです。 < !DOCTYPE html PUBLIC "- //W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> jQuery イメージ プレビュー ="text/javascript " src="js/jquery-1.10.2.min.js"> サイズ:12px; パディング:50px;} <br>.clsImg{パディングトップ:300px;} <br>.imgAttr{位置:絶対; 幅:300px; 余白:1px; :135px; 表示: なし;} <br> <br>var x = 0; var y = 0 ; <br>$("img").mouseover(function (e) { //マウスが画像に移動したときのイベントを追加し、拡大画像を表示します<br>$("#imgShow") .attr("src", this.src).show(); <br>$("img").mouseout(function () { //画像を非表示にするにはマウスを離します🎜>$("#imgShow").hide (); <br>}) <br>}) <br><br></head> ; <br><img class="imgAttr " id="imgShow" src="" alt=""/> <br><img class="clsImg" src="img1.jpg" alt="" /> <br><img class= "clsImg" src="img2.jpg" alt=""/> <br><img class="clsImg" src="img3.jpg" alt="" /> <br><img class= "clsImg" src="img4.jpg"/> <br><br></html> <br> <br>最初のページ: <br><br> <br>3 番目の画像にマウスを置いた場合の効果: <br><br> </div>