Alternative Image

joe · May 17, 2005

Hi. Is there a way with Javascript to use a generic image if the one I want
is not found?
I'd appreciate if someone can post a code sample, or poit me to one. Thanks
in advance.

RobB · May 17, 2005

joe said:
Hi. Is there a way with Javascript to use a generic image if the one I want
is not found?
I'd appreciate if someone can post a code sample, or poit me to one. Thanks
in advance.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<style type="text/css">

img {display: block;}

</style>
</head>
<body>
<img
src="http://www.google.com/intl/en/images/logo.gif"
onerror="this.src='http://www.sonofsofaman.com/images/photo-not-available-180x240.gif'">
<img
src="http://www.google.com/intl/en/images/logo.giff"
onerror="this.src='http://www.sonofsofaman.com/images/photo-not-available-180x240.gif'">
</body>
</html>

Could do this more systematically...

joe · May 17, 2005

Ok. I think I found a solution:

<img src="orig_image.jpg" onerror="this.src='alt_image.jpg';">

Thomas 'PointedEars' Lahn · May 24, 2005

joe said:
Ok. I think I found a solution:

<img src="orig_image.jpg" onerror="this.src='alt_image.jpg';">

This is not a standards compliant solution, though. The `img' element
does not have an `onerror' attribute in Valid (X)HTML markup, and the
`alt' attribute is required. A standards compliant solution, taking
into account additional DOM features, could be


<html>
<head>
...
<meta http-equiv="Content-Script-Type" content="text/javascript">
<script type="text/javascript">
function replaceOnError(img, alt_src)
{
if (typeof img.onerror != "undefined")
{
img.onerror = function()
{
this.src = alt_src;
return true;
}
}
}
</script>
...
</head>

<body onload="replaceOnError(document.images['foo'], 'alt_image.jpg');">
...
<img src="orig_image.jpg" alt="foo" name="foo">
...
</body>
</html>

But you rather should consider the ErrorDocument directive of httpd
compatible Web servers (like the Apache HTTP Server) which will also
work without client-side script support.

PointedEars

Thomas 'PointedEars' Lahn · May 25, 2005

commercial said:
[...]
"Alternative Image"

There is no such thing. I means otherwise, how e.g. blind people
ought to be presented an idea of an "invisible picture"
in TEXTUAL representation.

(This is the only part of your posting with some meaning, so I'll reply
to it.)

Well, the `alt' property of the respective HTMLImageElement and so the
`alt' attribute of the related `img' element can be changed as well.
That would result in different presentation on error for users without
image support, too.

And that must not make an error or noise on demand only.

You sure are not an eye dog in this group.

I am sure that you are not really know to whom you are replying, or
rather yelling, what.

[Top post, full quote]

You may also want to read the newsgroup's FAQ and FAQ notes.

PointedEars

Add Image and label dynamically inside the dropdown	2	Mar 11, 2022
Animate a background image	0	May 4, 2022
Pink effect hovering image	1	Mar 25, 2021
Image recognition	4	Oct 4, 2022
Image issues	0	Apr 2, 2023
Image upload not working in browser	4	Sep 9, 2022
Pyautogui, cv2 and cannot find image	0	Feb 7, 2023
Image overlay and comparison code error.	2	Jul 1, 2021

Alternative Image

joe

RobB

joe

Thomas 'PointedEars' Lahn

Thomas 'PointedEars' Lahn

Ask a Question

Similar Threads

Members online

Forum statistics

Latest Threads