Swap image AND text onMouseOver

[tak237]

Hi!

I'm quite desperate with this one, any help would be much appreciated.

What I'm trying to do is have a page with a list of images where once you rollover them you, that image with some text details (for example title) below will appear on the page (in a different position). At the moment the image appears, but I can't have the text appear as well. All this data (images, text) is grabbed from a database using ASP, but that isn't really the issue.


These are the two Javascript functions I use:

function MM_findObj(n, d) { //v4.0
var p,i,x;
if(!d) d=document;
if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && document.getElementById) x=document.getElementById(n); return x;
}

function MM_swapImage() { //v3.0

var i,j=0,x,a=MM_swapImage.arguments;

document.MM_sr=new Array;
for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){
document.MM_sr[j++]=x;
if(!x.oSrc) x.oSrc=x.src;
x.src=a[i+2];}
}


The code below is the asp/html. This is inside a loop and I use Response.Write:

"<td align='left' valign='top' class='TEXT'>"

"<a onmouseover=MM_swapImage('mainpic','','images/Paintings/" & rst_Painting("Painting_Image_Small") & "',1) href=javascript:;>"

"<img src='Images/Paintings/" & rst_Painting("Painting_Image_Small") & "' border='0' ALT='" & rst_Painting("Painting_Name") & "'><br>"

"</a>"


And this is the place where the images appear:

<img height="60" src="Images/paintings/pictures_sm_03_01.jpg" width="60" name="mainpic">

[Khalid Ali]

something like this may help

Resource Link (http://www.webapplikations.com/pages/html_js/image_examples/SimpleImageSwap.html)

[tak237]

Thanks Khalid, I'll have a look.