私はウェブサイトに取り組んでおり、html/css にネイティブではないスタイルと外観のために、テキストの写真を広範囲に使用しました。ご覧のとおり...画像内のテキストが少しでもぼやけているかどうかを検出するのは非常に簡単です。
すべてが非常に明確で、Chrome で問題なく動作します。ただし、IE または FF でページのロードが完了した後に問題が発生します。前後にズームしても、すべての画像は永遠にぼやけてしまいます。違う。グルがすぐにこれを解決できることを願っています。前もって感謝します!
コンテキストのサンプル コード:
<div id="whiteBg">
<img id="birdMain" src="Pictures/bird.png" alt="title"/>
<img id="flowerMain1" src="Pictures/flower.png" alt="title"/>
<img id="flowerMain2" src="Pictures/flower.png" alt="title"/>
<img id="flowerMain3" src="Pictures/flower.png" alt="title"/>
<img id="titleMain" src="Pictures/csaname.png" alt="title"/>
<img id="csalogoMain" src="Pictures/csalogo.png" alt="asdf"/>
</div>
解決策を修正するために必死になって画像をプリロードしようとしましたが、それも何もしませんでした。コードのプリロード行がまったく機能しているかどうかさえわかりません。
コードのプリロード:
var images = new Array("Pictures/1greatwall.jpg", "Pictures/2spring-scrolls.jpg", "Pictures/3lily.jpg", "Pictures/4heavy-snow.jpg", "Pictures/5sunrise.jpg", "Pictures/6crane.jpg", "Pictures/7winding-road.jpg", "Pictures/8guqin.jpg", "Pictures/9sealflower.jpg", "Pictures/10pine.jpg", "Pictures/11huangshan.jpg", "Pictures/12dragon.jpg", "Pictures/13otters.jpg", "Pictures/1greatwall.jpg", "Pictures/14emei.jpg");
var imgNumber = 1;
var numberOfImg = images.length;
if (document.images) {
//loads slideshow picures
var image1 = new Image();
image1.src = "Pictures/1greatwall.jpg";
var image2 = new Image();
image2.src = "Pictures/2spring-scrolls.jpg";
var image3 = new Image();
image3.src = "Pictures/3lily.jpg";
var image4 = new Image();
image4.src = "Pictures/4heavy-snow.jpg";
var image5 = new Image();
image5.src = "Pictures/5sunrise.jpg";
var image6 = new Image();
image6.src = "Pictures/6crane.jpg";
var image7 = new Image();
image7.src = "Pictures/7winding-road.jpg";
var image8 = new Image();
image8.src = "Pictures/8guqin.jpg";
var image9 = new Image();
image9.src = "Pictures/9sealflower.jpg";
var image10 = new Image();
image10.src = "Pictures/10pine.jpg";
var image11 = new Image();
image11.src = "Pictures/11huangshan.jpg";
var image12 = new Image();
image12.src = "Pictures/12dragon.jpg";
var image13 = new Image();
image13.src = "Pictures/13otters.jpg";
var image14 = new Image();
image14.src = "Pictures/14emei.jpg";
//loads other essential background pictures...
var image15 = new Image();
image15.src = "Pictures/csalogo.jpg";
var image16 = new Image();
image16.src = "Pictures/bird.jpg";
var image17 = new Image();
image17.src = "Pictures/flower.jpg";
var image18 = new Image();
image18.src = "Pictures/csaname.jpg";
var image19 = new Image();
image19.src = "Pictures/seemorename.jpg";
var image20 = new Image();
image20.src = "Pictures/seemore.jpg";
var image21 = new Image();
image21.src = "Pictures/leftarrow.jpg";
var image22 = new Image();
image22.src = "Pictures/slideshowbutton.jpg";
var image23 = new Image();
image23.src = "Pictures/rightarrow.jpg";
var image24 = new Image();
image24.src = "Pictures/logo.jpg";
var image25 = new Image();
image25.src = "Pictures/menu.jpg";
var image26 = new Image();
image26.src = "Pictures/csa.jpg";
}
新しいメモ:
ウィンドウのサイズ変更/ズーム後の画像自体の更新は、Chrome では自動的に機能することがわかりましたが、Firefox ではそうではありません。ちょうどテストされました。これの根本的な原因は何ですか?