brython
11-23-2002, 12:06 AM
I don't know much about Javascript and CSS and such, so please bear with me. I'm trying to get an image I have hidden to become visible when a part of the other image (image mapped) has been MouseOver'ed. However, I seem to be having a really difficult time trying to get this to work. I tried to search for the same thing here, but I couldn't find anything that dealt with what I'm trying to do.
Any help will be very much appreciated.
Thanks!
Gregory Schultz
--------------The culprit code:-----------------
This is in the HEAD:
<map name="map">
<area shape="poly" coords="671,393,677,393,681,395,686,397,690,400,694,402,712,404,722,411,725,411,728,409,730,410,732,416,733, 423,730,437,730,442,727,447,723,452,723,455,728,456,741,446,746,447,746,449,710,476,700,481,678,481, 669,472,652,435,652,426,655,420,657,411,665,398" onMouseOver="showObject(roseyoung)" onMouseOut="hideObject(roseyoung)">
</map>
<SCRIPT language="JavaScript">
<!--
/* Show an object */
function showObject(object) {
object.visibility = VISIBLE;
}
/* Hide an object */
function hideObject(object) {
object.visibility = HIDDEN;
}
// -->
</SCRIPT>
And this is all that's in the BODY:
<div id="alliereadme" style="position: absolute; top: 0px; left: 0px; width: 768px; height: 508px; visibility: visible; z-index: 0">
<IMG src="./images/AllieReadme768.jpg" width="768" height="508" border="0" usemap="#map"></DIV>
<DIV id="roseyoung" style="position: absolute; top: 0px; left: 600px; width: 168px; height: 310px; visibility: hidden; z-index: 0">
<IMG src="./images/AllieReadme768RoseYoung.jpg" width="168" height="310" border="0"></DIV>
Am I missing something here? Judging from an older website I worked on, I believe this should work...unless my eyes aren't seeing something essential, which is very probable. Thanks again.
Any help will be very much appreciated.
Thanks!
Gregory Schultz
--------------The culprit code:-----------------
This is in the HEAD:
<map name="map">
<area shape="poly" coords="671,393,677,393,681,395,686,397,690,400,694,402,712,404,722,411,725,411,728,409,730,410,732,416,733, 423,730,437,730,442,727,447,723,452,723,455,728,456,741,446,746,447,746,449,710,476,700,481,678,481, 669,472,652,435,652,426,655,420,657,411,665,398" onMouseOver="showObject(roseyoung)" onMouseOut="hideObject(roseyoung)">
</map>
<SCRIPT language="JavaScript">
<!--
/* Show an object */
function showObject(object) {
object.visibility = VISIBLE;
}
/* Hide an object */
function hideObject(object) {
object.visibility = HIDDEN;
}
// -->
</SCRIPT>
And this is all that's in the BODY:
<div id="alliereadme" style="position: absolute; top: 0px; left: 0px; width: 768px; height: 508px; visibility: visible; z-index: 0">
<IMG src="./images/AllieReadme768.jpg" width="768" height="508" border="0" usemap="#map"></DIV>
<DIV id="roseyoung" style="position: absolute; top: 0px; left: 600px; width: 168px; height: 310px; visibility: hidden; z-index: 0">
<IMG src="./images/AllieReadme768RoseYoung.jpg" width="168" height="310" border="0"></DIV>
Am I missing something here? Judging from an older website I worked on, I believe this should work...unless my eyes aren't seeing something essential, which is very probable. Thanks again.