onmouseover

[Matthew Paterson]

I am creating a homepage webpage.

I have created an 800x600 image with various sections that I am using as
buttons, these have been mapped out using an ImageMap in HTML. Is there
any way that I can get the basic image button (which is incorporated
into the main image) to change when I roll over it.

Some sample code :

<IMG SRC="bg.png" WIDTH=800 HEIGHT=600 BORDER=0 USEMAP="#map">

<MAP NAME="map">
<AREA SHAPE="POLY" COORDS="157,299,218,299,219,278,223,259,228,241,
170,220,165,236,161,255,157,283,157,299"HREF="file:/about.html"> </MAP>

I know about onmouseover but I dont think I can apply that here.

Any ideas, most appreciated.

 

[Leif K-Brooks]

I have created an 800x600 image

And then you resized it to something reasonable, right?

with various sections that I am using as
buttons, these have been mapped out using an ImageMap in HTML. Is there
any way that I can get the basic image button (which is incorporated
into the main image) to change when I roll over it.

You can't do that.

<AREA SHAPE="POLY" COORDS="157,299,218,299,219,278,223,259,228,241,
170,220,165,236,161,255,157,283,157,299"HREF="file:/about.html">

You are using the alt attribute on the real page, right?

 

[Richard]

I am creating a homepage webpage.

I have created an 800x600 image with various sections that I am using as
buttons, these have been mapped out using an ImageMap in HTML. Is there
any way that I can get the basic image button (which is incorporated
into the main image) to change when I roll over it.

Some sample code :

<IMG SRC="bg.png" WIDTH=800 HEIGHT=600 BORDER=0 USEMAP="#map">

<MAP NAME="map">
<AREA SHAPE="POLY" COORDS="157,299,218,299,219,278,223,259,228,241,
170,220,165,236,161,255,157,283,157,299"HREF="file:/about.html"> </MAP>

I know about onmouseover but I dont think I can apply that here.

Any ideas, most appreciated.
Fear of a flat planet

Why such a big area?
Try a smaller image area and use a menu area instead.
When a mouseover occurs on the link, the image is swapped accordingly.
Preload your images with an array.

<script type="javascript/text">
if (document.images) {
images=new array(99)
images[0]=new array(99);
images[0].src="main.jpg;
</script>

Now put this in your link:
onMouseOver="document.images[0].src='swap1.jpg'; return true;"
onMouseOut="document.images[0].src='main.jpg'; return true; "

This causes the static image to be replaced with your new one.
It works in IE and Mozilla.
If the browser does not have javascript, no swap takes place, yet the menu
works the same.

 

[Leif K-Brooks]

<script type="javascript/text">
if (document.images) {
images=new array(99)
images[0]=new array(99);
images[0].src="main.jpg;
</script>

Do you ever get tired of giving bad advice? That should be
text/javascript, and you should be using an external script file.

Now put this in your link:
onMouseOver="document.images[0].src='swap1.jpg'; return true;"
onMouseOut="document.images[0].src='main.jpg'; return true; "

And why not change the events in the script and save yourself some typing?

 

[Richard]

<script type="javascript/text">
if (document.images) {
images=new array(99)
images[0]=new array(99);
images[0].src="main.jpg;
</script>

Do you ever get tired of giving bad advice? That should be
text/javascript, and you should be using an external script file.

Apparently it makes no difference which is before or after the /.
All that does matter is that is identified properly.
Now if you can cite the official ruling where it says that it *MUST* be in
that order, please do.

Now put this in your link:
onMouseOver="document.images[0].src='swap1.jpg'; return true;"
onMouseOut="document.images[0].src='main.jpg'; return true; "

And why not change the events in the script and save yourself some
typing?

Because I have not yet reached that level of expertise.

 

[rf]

<script type="javascript/text">
if (document.images) {
images=new array(99)
images[0]=new array(99);
images[0].src="main.jpg;
</script>

Do you ever get tired of giving bad advice? That should be
text/javascript, and you should be using an external script file.

Apparently it makes no difference which is before or after the /.
All that does matter is that is identified properly.
Now if you can cite the official ruling where it says that it *MUST* be in
that order, please do.

The bit before the / is the content type. The bit after the / is the content
subtype.

RFC2045 ( http://www.ietf.org/rfc/rfc2045.txt ) and RFC2046 (
http://www.ietf.org/rfc/rfc2045.txt ) specify that content types and content
subtypes, amongst other things, will be assigned and listed by the the IANA.
This leads us to the IANA list of said types and subtypes,
ftp://ftp.isi.edu/in-notes/iana/assignments/media-types/media-types

Quite clerely in there, as the first entry, is the type "text". IANA does
not specifically mention a subtype of "javascript", possiblly because it
doesn't care, but it also specifically does not mention any type of
"javascript"

So, type="text/javascript" may be slightly against the standards because the
subtype javascript is not mentioned by IANA.

However type="javascript/text" is very clearly against the standards. There
is no such type as "javascript".

Note, type="text/css" *is* mentioned by IANA. type="css/text" is not.

Is the above official enough for you?

Because I have not yet reached that level of expertise.

There is no need to state the obvious.

Cheers
Richard.

 

[Richard]

rf! wrote:

Richard wrote:
<script type="javascript/text">
if (document.images) {
images=new array(99)
images[0]=new array(99);
images[0].src="main.jpg;
</script>

Do you ever get tired of giving bad advice? That should be
text/javascript, and you should be using an external script file.

Apparently it makes no difference which is before or after the /.
All that does matter is that is identified properly.
Now if you can cite the official ruling where it says that it *MUST* be
in that order, please do.

The bit before the / is the content type. The bit after the / is the
content subtype.

RFC2045 ( http://www.ietf.org/rfc/rfc2045.txt ) and RFC2046 (
http://www.ietf.org/rfc/rfc2045.txt ) specify that content types and
content subtypes, amongst other things, will be assigned and listed by
the the IANA. This leads us to the IANA list of said types and subtypes,
ftp://ftp.isi.edu/in-notes/iana/assignments/media-types/media-types

Quite clerely in there, as the first entry, is the type "text". IANA does
not specifically mention a subtype of "javascript", possiblly because it
doesn't care, but it also specifically does not mention any type of
"javascript"

So, type="text/javascript" may be slightly against the standards because
the subtype javascript is not mentioned by IANA.

However type="javascript/text" is very clearly against the standards.
There is no such type as "javascript".

Note, type="text/css" *is* mentioned by IANA. type="css/text" is not.

Is the above official enough for you?

Thank you sir but that was a job for Mr. Brooks.
Regardless of what the RFC or IANA says, the browser apparently does not
care which way is which.
"Type =" would however, mean that what follows is the definition of "type".
So that if we had [ type="text" ] would meet the definition.
The / only further defines what "type" is to be.
Much like the use of a tag such as [background:solid red] Instead of saying
[background-color:red].
Or as in saying, 24 *10 instead of 10 * 24.

 

[Owen Jacobson]

Thank you sir but that was a job for Mr. Brooks.

It's a public discussion. If you wish to make it private take it to
email.

Regardless of what the RFC or IANA says, the browser apparently does
not care which way is which.

This is true. That doesn't make it correct; most browsers accept any
phrase at all in the type attribute and interpret as javascript by
default unless another 'known' script type is specified. It's called
error correction.

"Type =" would however, mean that what follows is the definition of
"type". So that if we had [ type="text" ] would meet the definition.

*Except that* the type attribute is intended, as per the HTML
specification and DTD, "media type, as per [RFC2045]".

<http://www.w3.org/TR/html4/sgml/dtd.html#ContentType>
<http://www.w3.org/TR/html4/interact/scripts.html#edef-SCRIPT>

 

[Bertilo Wennergren]

Regardless of what the RFC or IANA says, the browser apparently does not
care which way is which.

Have you tested in all browsers (all versions on all platforms)?

Have you tested in not-yet-released versions?

Browsers tend to become more and more standards-compliant, and more and
more strict about such matters. That's a trend since many years.

So better write your pages in a future-compatible way, i.e. according to
published standards.