Mouseover function use
I am using the mouseover function to supersize thumbnail photos in a separate table with two rows of one cell each. The attached code works correctly to change the photo in the top row of the separate table.
I now wish to enhance the code to also change an associated text caption in the second row to provide a correct caption for each new photo. This code is repeted in each thumbnail row/cell of the thumbnail table.
The supersize table top row is named "big" and the bottom row is named "txt".
Any thoughts?
<a href=#
ONMOUSEOVER="big.src='http://www.geocities.com/ccbebs/pics3667r/Restorationpics/FrontSuspensionAfter.jpg'">
<IMG WIDTH=72 HEIGHT=64
SRC="http://www.geocities.com/ccbebs/Images/72x64smalljpgs/FrontSuspensionAfterSMALL.jpg">
Please post your whole code with the tables etc.
Swon
Mouseover function
code is too long so I edited out unrelated code. Url to view all in action is: www.geocities.com/ccbebs/TablemakerTesting.htm
<TABLE WIDTH="20%" BGCOLOR="#FFFFFF" ALIGN="left" CELLSPACING="1" CELLPADDING="1" BORDER="1">
<caption valign="top" align="center">Mouse Over to Supersize</caption>
<TR><th>
<a href=# ONMOUSEOVER="big.src='URL FOR SUPERSIZED PHOTO HERE'">
<IMG WIDTH=72 HEIGHT=64
SRC="URL FOR THUMBNAIL HERE">
</TH>
<th>
</TR>
</TABLE>
<TABLE WIDTH="520" TABLE HEIGHT=310 BGCOLOR="#FFFFFF" ALIGN="right" BORDER="3">
<caption valign="top" align="center">Supersized Picture</caption>
*cell for photo*
<TR><TH>
<IMG WIDTH=520 HEIGHT=310 NAME="big"
SRC="http://www.geocities.com/ccbebs/pics3667r/Restorationpics/ShinyStuffRemoved.jpg">
</TH></TR>
* cell for caption *
<TR><TD ALIGN=MIDDLE Font size="1"><span style="font-size:13"><font face=Verdana, Arial>
Still need to put appropriate caption here???</FONT><BR>
</TD></TR>
</table>
</body>
</html>
Hope that's what you want:
<script language=javascript>
function changeText(NewTxt){
obj = document.getElementById("changetext");
obj.innerHTML = NewTxt;
}
</script>
<style type="text/css">
<!--
.changetext{
font-family:arial,verdana,helvetica;
font-size:10pt;
color:#00003F;
}
-->
</style>
<TABLE WIDTH="20%" BGCOLOR="#FFFFFF" ALIGN="left" CELLSPACING="1" CELLPADDING="1" BORDER="1">
<caption valign="top" align="center">Mouse Over to Supersize</caption>
<TR><th>
<a href=# ONMOUSEOVER="big.src='URL FOR SUPERSIZED PHOTO HERE';changeText('That is the new text for this picture')">
<IMG WIDTH=72 HEIGHT=64 SRC="URL FOR THUMBNAIL HERE">
</TH>
<th>
</TR>
</TABLE>
<TABLE WIDTH="520" TABLE HEIGHT=310 BGCOLOR="#FFFFFF" ALIGN="right" BORDER="3">
<caption valign="top" align="center">Supersized Picture</caption>
*cell for photo*
<TR><TH>
<IMG WIDTH=520 HEIGHT=310 NAME="big" SRC="http://www.geocities.com/ccbebs/pics3667r/Restorationpics/ShinyStuffRemoved.jpg">
</TH></TR>
* cell for caption *
<TR><TD ALIGN=MIDDLE Font size="1"><div id="changetext" class="changetext">
Still need to put appropriate caption here???</div><BR>
</TD>
</TR>
</table>
Swon
Mouseover Function
SWON you are da Man!
The code you suggested worked correctly the first time. Somewhat unusual in this world. Thanks!
Thread Information
Users Browsing this Thread
There are currently 1 users browsing this thread. (0 members and 1 guests)
Posting Permissions
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts
Forum Rules
Bookmarks