can alt property of IMG be dynamically changed with rollover?

[pablo]

Dear NGers,

I would like to change the alt-text with the changing of the image during a
mouseover action.

Can document.images[0].altView be changed dynamically?

TIA,

pablo

[DU]

pablo wrote:

Dear NGers,

I would like to change the alt-text with the changing of the image during a
mouseover action.

Can document.images[0].altView be changed dynamically?

TIA,

pablo

I don't know about a mouseover but I know changing the alt attribute can
be done on a click event which changes the image. I have a demo page
that does that and it works in MSIE 6 SP1a, Mozilla 1.4+, NS 7.1,
K-meleon 0.8.2 and Opera 7.51.

function YourFunctionName(evt)
{
var RefImage = (evt) ? evt.target : event ? event.srcElement : null;
if (RefImage.src.lastIndexOf("Off") != -1)
{
RefImage.src = "path/filenameOn.ext";
RefImage.title = "New title text";
RefImage.alt = "New alternate text";
}
else
{
RefImage.src = "path/filenameOff.ext";
RefImage.title = "Previous title text";
RefImage.alt = "Previous alternate text";
};
}
Not tested on a mouseover. Remember that it takes considerably a lot of
cpu, video memory to change the display of images, furthermore if the
mouseover is done quickly. On some modest system, this may crash the
application. So, the image should definitively be small and have its
number of colors reduced.

DU

[Grant Wagner]

pablo wrote:

Dear NGers,

I would like to change the alt-text with the changing of the image during a
mouseover action.

Can document.images[0].altView be changed dynamically?

TIA,

pablo

Since the ALT attribute is only supposed to appear in place of an unavailable
or undisplayable image (Netscape started the very bad habit of displaying the
ALT text as a roll-over tooltip), there's little reason to update it
dynamically via Javascript.

You probably want to change the TITLE attribute, and that is very easy to do.
However, the TITLE only appears as a tooltip when you are already over the
image, so changing it's value onmouseover seems sort of pointless, since the
only time it will be seen is when you are over the image. You might as well
just set it to what you want to appear when you the mouse rolls over the image
normally.

--
| Grant Wagner <gw*****@agricoreunited.com>

* Client-side Javascript and Netscape 4 DOM Reference available at:
*
http://devedge.netscape.com/library/...ce/frames.html

* Internet Explorer DOM Reference available at:
*
http://msdn.microsoft.com/workshop/a...ence_entry.asp

* Netscape 6/7 DOM Reference available at:
* http://www.mozilla.org/docs/dom/domref/
* Tips for upgrading JavaScript for Netscape 7 / Mozilla
* http://www.mozilla.org/docs/web-deve...upgrade_2.html

[Thomas 'PointedEars' Lahn]

pablo wrote:

I would like to change the alt-text with the changing of the image
during a mouseover action.

Can document.images[0].altView be changed dynamically?

Which DOM provides an "altView" property for (HTML)Image(Element)
objects? Use the "alt" property, it is part of all widespread DOMs,
including W3C DOM Level 2 HTML.

BTW: Your From header is invalid.
PointedEars

[pablo]

"Thomas 'PointedEars' Lahn" <Po*********@nurfuerspam.de> wrote in message
news:40**************@PointedEars.de...

pablo wrote:

Can document.images[0].altView be changed dynamically?

Which DOM provides an "altView" property for (HTML)Image(Element)
objects? Use the "alt" property, it is part of all widespread DOMs,
including W3C DOM Level 2 HTML.

PointedEars

I looped through the Image properties and found altValue.
I misspelled it doing the post. Sorry.

pablo

P.S.: Thanks to all who posted some answer.

[Grant Wagner]

pablo wrote:

"Thomas 'PointedEars' Lahn" <Po*********@nurfuerspam.de> wrote in message
news:40**************@PointedEars.de...

pablo wrote:

Can document.images[0].altView be changed dynamically?

Which DOM provides an "altView" property for (HTML)Image(Element)
objects? Use the "alt" property, it is part of all widespread DOMs,
including W3C DOM Level 2 HTML.

PointedEars

I looped through the Image properties and found altValue.
I misspelled it doing the post. Sorry.

In which user agent did you find an "altValue" property of the Image object?
I ran the code below in Netscape 4.78, Firefox 0.9, Internet Explorer 6SP1
and Opera 7.51 and could not locate an "altValue" property in any of those
user agents.

<body onload="load();">
<form name="outputForm">
<textarea name="output" cols="40" rows="20"></textarea>
</form>
<script type="text/javascript">
function load() {
var obj = new Image();
obj.onload = showProp;
obj.src = 'someimage.gif';
}
function showProp() {
var s = [];
for (var prop in this) {
if (prop != 'textContent') {
s.push(
prop + ' = ' + this[prop] +
' (' + typeof this[prop] + ')'
);
}
}
document.forms['outputForm'].elements['output'].value = s.join('\n');
}
</script>
</body>

Nor is "altValue" documented as a property of the Image object at <url:
http://msdn.microsoft.com/workshop/a...bjects/img.asp />

By the way, in case anyone is wondering, the reason for the "if (prop !=
'textContent')" test is because Firefox 0.9 throws an exception if you
attempt to access "typeof (new Image()).textContent".

--
| Grant Wagner <gw*****@agricoreunited.com>

* Client-side Javascript and Netscape 4 DOM Reference available at:
*
http://devedge.netscape.com/library/...ce/frames.html

* Internet Explorer DOM Reference available at:
*
http://msdn.microsoft.com/workshop/a...ence_entry.asp

* Netscape 6/7 DOM Reference available at:
* http://www.mozilla.org/docs/dom/domref/
* Tips for upgrading JavaScript for Netscape 7 / Mozilla
* http://www.mozilla.org/docs/web-deve...upgrade_2.html

[pablo]

"Grant Wagner" <gw*****@agricoreunited.com> wrote in message
news:40***************@agricoreunited.com...

pablo wrote:

I looped through the Image properties and found altValue.
I misspelled it doing the post. Sorry.
In which user agent did you find an "altValue" property of the Image

object? I ran the code below in Netscape 4.78, Firefox 0.9, Internet Explorer 6SP1
and Opera 7.51 and could not locate an "altValue" property in any of those
user agents.

<body onload="load();">
<form name="outputForm">
<textarea name="output" cols="40" rows="20"></textarea>
</form>
<script type="text/javascript">
function load() {
var obj = new Image();
obj.onload = showProp;
obj.src = 'someimage.gif';
}
function showProp() {
var s = [];
for (var prop in this) {
if (prop != 'textContent') {
s.push(
prop + ' = ' + this[prop] +
' (' + typeof this[prop] + ')'
);
}
}
document.forms['outputForm'].elements['output'].value = s.join('\n');
}
</script>
</body>

Nor is "altValue" documented as a property of the Image object at <url:
http://msdn.microsoft.com/workshop/a...bjects/img.asp />
By the way, in case anyone is wondering, the reason for the "if (prop !=
'textContent')" test is because Firefox 0.9 throws an exception if you
attempt to access "typeof (new Image()).textContent".

--
| Grant Wagner <gw*****@agricoreunited.com>

* Client-side Javascript and Netscape 4 DOM Reference available at:
*
http://devedge.netscape.com/library/...3/reference/fr
ames.html
* Internet Explorer DOM Reference available at:
*
http://msdn.microsoft.com/workshop/a...l_reference_en
try.asp
* Netscape 6/7 DOM Reference available at:
* http://www.mozilla.org/docs/dom/domref/
* Tips for upgrading JavaScript for Netscape 7 / Mozilla
* http://www.mozilla.org/docs/web-deve...upgrade_2.html

Just did :
function img_prop() {
// loop through image properties
plt = document.images[0] ;
for( p in plt ) {
document.write("<br />Prop.= ", p, "Value= ", plt[p] ) ;
}
}

in my IE 5 version.
First 4 properties look like this:
Prop.= accessKeyValue=
Prop.= alignValue=
Prop.= allValue= [object]
Prop.= altValue= Zoals het was en wordt (klik maar...)
And the altValue corresponds to the alt-value of the image. (output is
alfabetically ordered)

Same results on IE5.5 sp2! (output not in alfabet order)

Trying to change the alt value in javascritps results in script error
message.
No 'simple' Alt-property found.

Thanks for your interest

pablo

[Jim Ley]

On Thu, 17 Jun 2004 20:03:46 GMT, Grant Wagner
<gw*****@agricoreunited.com> wrote:

Since the ALT attribute is only supposed to appear in place of an unavailable
or undisplayable image (Netscape started the very bad habit of displaying the
ALT text as a roll-over tooltip), there's little reason to update it
dynamically via Javascript.
no, there is! if the image changes the content, then the alternative
content has to change too! (oh and it's not bad behaviour....)
You might as well
just set it to what you want to appear when you the mouse rolls over the image
normally.

There's more to title and alt than just mouse nav, remember the Access
Technologies.

Jim.
--
comp.lang.javascript FAQ - http://jibbering.com/faq/

[pablo]

"Grant Wagner" <gw*****@agricoreunited.com> wrote in message
news:40***************@agricoreunited.com...

In which user agent did you find an "altValue" property of the Image object? I ran the code below in Netscape 4.78, Firefox 0.9, Internet Explorer 6SP1
and Opera 7.51 and could not locate an "altValue" property in any of those
user agents.

<body onload="load();">
<form name="outputForm">
<textarea name="output" cols="40" rows="20"></textarea>
</form>
<script type="text/javascript">
function load() {
var obj = new Image();
obj.onload = showProp;
obj.src = 'someimage.gif';
}
function showProp() {
var s = [];
for (var prop in this) {
if (prop != 'textContent') {
s.push(
prop + ' = ' + this[prop] +
' (' + typeof this[prop] + ')'
);
}
}
document.forms['outputForm'].elements['output'].value = s.join('\n');
}
</script>
</body>

Nor is "altValue" documented as a property of the Image object at <url:
http://msdn.microsoft.com/workshop/a...bjects/img.asp />
By the way, in case anyone is wondering, the reason for the "if (prop !=
'textContent')" test is because Firefox 0.9 throws an exception if you
attempt to access "typeof (new Image()).textContent".

--
| Grant Wagner <gw*****@agricoreunited.com>

* Client-side Javascript and Netscape 4 DOM Reference available at:
*
http://devedge.netscape.com/library/...3/reference/fr
ames.html
* Internet Explorer DOM Reference available at:
*
http://msdn.microsoft.com/workshop/a...l_reference_en
try.asp
* Netscape 6/7 DOM Reference available at:
* http://www.mozilla.org/docs/dom/domref/
* Tips for upgrading JavaScript for Netscape 7 / Mozilla
* http://www.mozilla.org/docs/web-deve...upgrade_2.html

Sorry to say Grant,

but your code does not produce any output in the form textarea, nor does it
produce an error.

pablo

[Grant Wagner]

pablo wrote:

"Grant Wagner" <gw*****@agricoreunited.com> wrote in message
news:40***************@agricoreunited.com...

pablo wrote:

I looped through the Image properties and found altValue.
I misspelled it doing the post. Sorry.
In which user agent did you find an "altValue" property of the Image

object?

I ran the code below in Netscape 4.78, Firefox 0.9, Internet Explorer 6SP1
and Opera 7.51 and could not locate an "altValue" property in any of those
user agents.

<body onload="load();">
<form name="outputForm">
<textarea name="output" cols="40" rows="20"></textarea>
</form>
<script type="text/javascript">
function load() {
var obj = new Image();
obj.onload = showProp;
obj.src = 'someimage.gif';
}
function showProp() {
var s = [];
for (var prop in this) {
if (prop != 'textContent') {
s.push(
prop + ' = ' + this[prop] +
' (' + typeof this[prop] + ')'
);
}
}
document.forms['outputForm'].elements['output'].value = s.join('\n');
}
</script>
</body>

Nor is "altValue" documented as a property of the Image object at <url:
http://msdn.microsoft.com/workshop/a...bjects/img.asp

/>

By the way, in case anyone is wondering, the reason for the "if (prop !=
'textContent')" test is because Firefox 0.9 throws an exception if you
attempt to access "typeof (new Image()).textContent".

Just did :
function img_prop() {
// loop through image properties
plt = document.images[0] ;
for( p in plt ) {
document.write("<br />Prop.= ", p, "Value= ", plt[p] ) ;
}
}

in my IE 5 version.
First 4 properties look like this:
Prop.= accessKeyValue=
Prop.= alignValue=
Prop.= allValue= [object]
Prop.= altValue= Zoals het was en wordt (klik maar...)
And the altValue corresponds to the alt-value of the image. (output is
alfabetically ordered)

Yes, you're outputting:

Prop.=<theProperty>Value=<theValue>

and you're wondering why you are seeing:

Prop. =altValue=?

"alt" is the name of the properly, you are appending the word "Value" to that.

The first 4 properties are "accessKey", "align", "all", and "alt", _not_
"accessKeyValue", "alignValue", "allValue" and "altValue"

Replace:

document.write("<br />Prop.= ", p, "Value= ", plt[p] ) ;

with

document.write("<br />Prop.= ", p, " ; Value= ", plt[p] ) ;

(note the space, semi-colon and space separating the name of the property from
the string "Value") and you'll see that.
Same results on IE5.5 sp2! (output not in alfabet order)

Trying to change the alt value in javascritps results in script error
message.

No 'simple' Alt-property found.

Yes, a "simple" alt propery _was_ found, you appended the text string "Value" to
it during output.

--
| Grant Wagner <gw*****@agricoreunited.com>

* Client-side Javascript and Netscape 4 DOM Reference available at:
*
http://devedge.netscape.com/library/...ce/frames.html

* Internet Explorer DOM Reference available at:
*
http://msdn.microsoft.com/workshop/a...ence_entry.asp

* Netscape 6/7 DOM Reference available at:
* http://www.mozilla.org/docs/dom/domref/
* Tips for upgrading JavaScript for Netscape 7 / Mozilla
* http://www.mozilla.org/docs/web-deve...upgrade_2.html