CSS & ColdFusion

[The Scarecrow]

Ok I have a DIV that on rollover of an object it changes position to the mouse pointer. However, I also want it to replace the content of the DIV tag with ColdFusion code. Something like this:

<cfoutput><img src="../#staffmember.imageName[3]#" align="middle"><span class="style1">

#staffmember.wName[3]# </span> </cfoutput>

Does anyone know how to do this? Thanks.

(current link code):

<a

onmouseover="ShowContent('magnify'); return true;"

onmouseout="HideContent('magnify'); return true;"

href="java script:ShowContent('magnify')">

IMAGE

</a>

[Josh]

That's going to have to be AJAX, I assume. The easier way to do this is to have a separate div for each object and just have each object's div show/hide accordingly. The AJAX way may prove to be too "slow" for something like that being as how you'll want that to be megafast anyway.

[The Scarecrow]

ok if I have say seven pictures and I want the content of the DIV tag to change differently with each of the pictures. So I guess the code would be something like this.

Button Code:

<a

onmouseover="ShowContent('magnify'); return true; changeContent(2);"

onmouseout="HideContent('magnify'); return true;"

onClick="HideContent('magnify');"

href="staffmember.cfm?EmployeeID=2"><img src="../staff_pictures/thumb/tn_mckee.jpg" width="43" height="60" border="0"></a>

The Javascript would be:

<cfoutput>

<script language="javascript">

function changeContent(i) {

magnify = document.getElementById('magnify');

magnify.innerHTML = "<img src="../#staffmember.imageName#" align="middle"><span class="normalText">

#staffmember.wName# </span>";

}

</script>

</cfoutput>

The DIV tag would be:

<cfoutput><div id="magnify"><img src="../#staffmember.imageName[2]#" align="middle"><span class="normalText">

#staffmember.wName[2]# </span> </div></cfoutput>