0

我一直在做一个网站，我已经广泛使用文本图片来实现我不希望原生于 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 中并非如此。刚测试过。造成这种情况的根本原因是什么？

4

1 回答 1

1

此问题应在较新的浏览器版本中修复。

于 2014-07-11T22:25:23.603 回答