预载图片？ [英] Preloading images?

问题描述

var preload1 = new Image（）; preload1.src =" /pic/yay.gif" ;;

var preload2 = new Image（）; preload2.src =" /pic/nay.gif" ;;


以上是为了预装图像文件，是吗？问题是，它并没有在实践中实际上是这样做的。我知道哪里出错了？在附加的.js文件中，它可以是不同的工作吗？

-

-

Fabian

经常长时间访问我的网站！
http://www.lajzar.co.uk

var preload1 = new Image(); preload1.src = "/pic/yay.gif";
var preload2 = new Image(); preload2.src = "/pic/nay.gif";

The above is meant to preload image files, yes? Problem is, it doesnt
seem to be doing so in practice. Any idea where Im going wrong? Could it
be that things work differnetly when in an attached .js file?
--
--
Fabian
Visit my website often and for long periods!
http://www.lajzar.co.uk

推荐答案

Fabian写道：

Fabian wrote:

var preload1 = new Image（）; preload1.src =" /pic/yay.gif" ;;
var preload2 = new Image（）; preload2.src =" /pic/nay.gif" ;;

以上是为了预装图像文件，是吗？


是的，根据图像的（文件）大小，

这是几天前解释的坏事。

问题是，它在实践中似乎没有这样做。


你如何理解这个想法？你有任何脚本错误吗？

我知道哪里出错？


简单地说，至少在互联网上你不能修改用户的

缓存设置，你在这里看到的可能是如果它们会发生什么

与你的假设不符。

在附加的.js文件中，可能是因为工作不同吗？

var preload1 = new Image(); preload1.src = "/pic/yay.gif";
var preload2 = new Image(); preload2.src = "/pic/nay.gif";

The above is meant to preload image files, yes?
Yes, and depending on the (file) size of the image,
it is a Bad Thing as explained a few days ago.
Problem is, it doesnt seem to be doing so in practice.
How do you get that idea? Do you get any script errors?
Any idea where Im going wrong?
It is simply that at least on the Internet you cannot modify the user''s
cache settings and what you observe here is possibly what happens if they
do not match what you assume.
Could it be that things work differnetly when in an attached .js file?

取决于你所说的'附''。

PointedEars

Depends on what you mean by `attached''.
PointedEars

Thomas''PointedEars''Lahn <宝********* @ web.de>写在消息

新闻：3F ************** @ PointedEars.de ...

"Thomas ''PointedEars'' Lahn" <Po*********@web.de> wrote in message
news:3F**************@PointedEars.de...

Fabian写道：

Fabian wrote:

var preload1 = new Image（）; preload1.src =" /pic/yay.gif" ;;
var preload2 = new Image（）; preload2.src =" /pic/nay.gif" ;;

以上是为了预装图像文件，是吗？
是的，取决于图像的（文件）大小，
这是几天前解释的坏事。

var preload1 = new Image(); preload1.src = "/pic/yay.gif";
var preload2 = new Image(); preload2.src = "/pic/nay.gif";

The above is meant to preload image files, yes?
Yes, and depending on the (file) size of the image,
it is a Bad Thing as explained a few days ago.

有问题的图像在<每个3kb，如果

他们没有显示，页面就没有意义。

The images in question at < 3kb each, and the page wont make sense if
they dont get displayed.

问题是，它似乎没有在实践中这样做。

Problem is, it doesnt seem to be doing so in practice.

你是如何得到这个想法的？你有任何脚本错误吗？

How do you get that idea? Do you get any script errors?

我无论如何都没有错误。它位于
www.lajzar.co。 uk / en / index.html / animals.html （以及其他）如果你想要

来查看。由于我不知道代码中的哪个地方可能存在这样的错误，所以在这个阶段发布任何内容都是毫无意义的。

主要嫌疑人显然是错误的。

只是至少在互联网上你不能修改
用户的缓存设置和什么你在这里观察可能会发生什么，如果
他们与你的假设不符。


我希望我至少能够修改这个特定用户的

缓存设置以启用预加载。

No errors I can tell anyway. Its at
www.lajzar.co.uk/en/index.html/animals.html (amongst others) if you want
to look. Since I have no idea where in the code a bug of this kind might
reside, it seems pointless posting any in the group at this stage. The
prime suspect was apparently the wrong one.
It is simply that at least on the Internet you cannot modify the user''s cache settings and what you observe here is possibly what happens if they do not match what you assume.
Id have hoped I would at least be able to modify this particular user''s
cache settings to enable preloading.

在附加的.js

文件中，可能是因为工作不同吗？
取决于你是什​​么意思'附加''。

file?
Depends on what you mean by `attached''.

< script src =" blah.js" language =" GuavaJuice">

< / script>


那种附件。还有另一种方式吗？

-

-

Fabian

经常长时间访问我的网站！
http://www.lajzar.co.uk

<script src="blah.js" language="GuavaJuice">
</script>

That kind of attached. There is another way?
--
--
Fabian
Visit my website often and for long periods!
http://www.lajzar.co.uk

你好，如果这是一个相当啰嗦的答案而道歉...

Fabian写道：

Hi there, and apologies if this is a rather long-winded answer...
Fabian wrote:

托马斯''PointedEars''Lahn <宝********* @ web.de>在消息中写道
新闻：3F ************** @ PointedEars.de ...

"Thomas ''PointedEars'' Lahn" <Po*********@web.de> wrote in message
news:3F**************@PointedEars.de...

Fabian写道：

Fabian wrote:

var preload1 = new Image（）; preload1.src =" /pic/yay.gif" ;;
var preload2 = new Image（）; preload2.src =" /pic/nay.gif" ;;

以上是为了预装图像文件，是吗？
是的，[... SNIP ...]

var preload1 = new Image(); preload1.src = "/pic/yay.gif";
var preload2 = new Image(); preload2.src = "/pic/nay.gif";

The above is meant to preload image files, yes?
Yes, [...SNIP...]

有问题的图像位于<每个3kb，页面不会有意义，如果它们不显示。

The images in question at < 3kb each, and the page wont make sense if
they dont get displayed.

问题是，它似乎没有在实践中这样做。

Problem is, it doesnt seem to be doing so in practice.

你是如何得到这个想法的？ [... SNIP ...]

How do you get that idea? [...SNIP...]

无论如何都没有错误。

No errors I can tell anyway.

因为没有代码在那里检测发生的错误...


它在 www.lajzar.co.uk/en/index.html/animals.html

其实我在
www.lajzar.co.uk/en/animals.html


（等等）如果你想看。由于我不知道代码中的哪个地方可能会存在这种错误，因此在此阶段发布任何内容似乎毫无意义。主要嫌疑人显然是错误的。


这不是一个javascript问题......

Because there''s no code there to detect the error that''s happening ...

Its at www.lajzar.co.uk/en/index.html/animals.html
Actually I found at
www.lajzar.co.uk/en/animals.html

(amongst others) if you want to look. Since I have no idea where in the code a bug of this kind might
reside, it seems pointless posting any in the group at this stage. The
prime suspect was apparently the wrong one.

It''s not a javascript problem...

它是简单地说，至少在互联网上你不能修改用户的缓存设置，你在这里观察到的可能是如果它们与你的假设不匹配会发生什么。
我希望我至少能够修改这个特定用户的缓存设置以启用预加载。

It is simply that at least on the Internet you cannot modify the user''s
cache settings and what you observe here is possibly what happens if they
do not match what you assume.

Id have hoped I would at least be able to modify this particular user''s
cache settings to enable preloading.

我不相信用户'浏览器缓存设置有什么可做的

，图像是否预加载

I do not believe the user''s browser cache settings have anything to do
with whether the images "preload"

在附加的.js文件中，事情是否有所不同？

Could it be that things work differnetly when in an attached .js file?

不要相信......


但是这里是我尝试加载animals.html时发生的事情。页面：


1.浏览器请求animals.html

2.服务器说200 ok，这里是

3.浏览器认为它需要css.css&请求它

4.服务器说200好，这是

5.浏览器请求favicon.ico

6.服务器说200 ok，这是

[不要觉得无聊......]

7.浏览器看到它需要game1.js请求它。

8.服务器说200 ok，这是：

注意，你的Apache服务器将其作为application / x-javascript。

这可能与任何东西一样好，但是以文本/ javascript的形式提供它可能更常见

。虽然这与问题无关。


[这是有趣的部分：]

9.浏览器看到它需要yay.gif并请求它

10.服务器说404，找不到它（!!）

11.浏览器看到它需要nay.gif并请求它

12.服务器说404，找不到它（!!）


与缓存无关;与服务器有关，无法找到要服务的

图像。他们被要求作为/pic/yay.gif（或

/pic/nay.gif）来自 www.lajzar.co.uk


当你调用checkAnswers（）函数时，你构造了yay / nay

图片来源为


" pic / yay.gif"

" pic / nay.gif"


即没有首字母/。在这种情况下，图像显示。所以

的答案就是在你的预装代码中你试图从错误的地方获取图像

。


我认为你可以在图像预加载上放置一个onerror事件处理程序来检测错误：


preload1 = new Image（）;

preload1.onerror = function（）{alert（" No Preload-yay"）;};

preload1.src =" /pic/yay.gif" ;;


虽然那不是很漂亮。并且由于您已经编码了checkAnswers（）

函数（具有正确的图像位置），问题自行修复

（即使图像显示可能不如你想要的。


HTH，

Stephen

No. Don''t believe so ...

But here''s what happened when I tried loading the "animals.html" page:

1. Browser requests animals.html
2. Server says 200 ok, here it is
3. Browser sees it needs css.css & requests it
4. Server says 200 ok, here it is
5. Browser requests "favicon.ico"
6. Server says 200 ok, here it is
[ don''t get bored yet ...]
7. Browser sees it needs "game1.js" and requests it.
8. Server says 200 ok, here it is:
Note, your Apache server serves this as application/x-javascript.
This is probably as ok as anything, but it may be more usual to serve it
as text/javascript. Though this has nothing to do with the problem.

[This is the interesting part:]
9. Browser sees it needs yay.gif and requests it
10. Server says 404, can''t find it (!!)
11. Browser sees it needs nay.gif and requests it
12. Server says 404, can''t find it (!!)

Has nothing to do with cache; has to do with the server can''t find the
images to serve. They are being requested as /pic/yay.gif (or
/pic/nay.gif) from www.lajzar.co.uk

When you call the checkAnswers() function, you construct the yay/nay
image sources as

"pic/yay.gif"
"pic/nay.gif"

That is, without the starting "/". In this case the images show. So the
answer is that in your preload code you''re trying to fetch the images
from the wrong place.

I think you can put an onerror event handler on the image preloads to
detect the error:

preload1 = new Image();
preload1.onerror=function(){alert("No Preload-yay");};
preload1.src = "/pic/yay.gif";

ALthough that''s not very pretty. And as you''ve coded the checkAnswers()
function (with the correct image location) the problem fixes itself
(even if image showing might not be as fast as you''d like).

HTH,
Stephen

这篇关于预载图片？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！