128. Como mostrar 4 imagenes de la BDs para luego hacer navegacion con MouseOver?
La respuesta
Código PHP:
<head>
<script>
function changeimage(towhat,url){
if (document.images){
document.images.targetimage.src=towhat.src
gotolink=url
}
}
function warp(){
window.location=gotolink
}
</script>
<script language="JavaScript1.1">
var myimages=new Array()
var gotolink="#"
function preloadimages(){
for (i=0;i<preloadimages.arguments.length;i++){
myimages[i]=new Image()
myimages[i].src=preloadimages.arguments[i]
}
}
</script>
</head>
Esto dentro del body para la precarga de las imagenes:
<script>
preloadimages("<%=rs("foto1")%>","<%=rs("foto2")%>","<%=rs("foto3")%>","<%=rs("foto4")%>")
</script>
Aqui va la imagen mas grande que sera reemplazada por las de abajo cuando se haga el mouseover:
ponerla donde quiera
<a href="javascript:warp()"><img src="<%= rs("foto1") %>" name="targetimage" border=0 width=175 height=200></a>
Y esto donde van las imagenes para hacer el mouse over:
<td><a href="verfoto.asp?id=<%=rs("id")%>" onMouseover="changeimage(myimages[0],this.href)">
<img src="<%=rs("foto1") %>" border=0 width="36" height="41"></a></td>
<td><a href="verfoto.asp?id=<%=rs("id")%>" onMouseover="changeimage(myimages[1],this.href)">
<img src="<%= rs("foto1") %>" border=0 width="36" height="41"></a></td>
<td><a href="verfoto.asp?id=<%=rs("id")%>" onMouseover="changeimage(myimages[2],this.href)">
<img src="<%= rs("foto1") %>" border=0 width="36" height="41"></a></td>
<td><a href="verfoto.asp?id=<%=rs("id")%>" onMouseover="changeimage(myimages[3],this.href)">
<img src="<%= rs("foto1") %>" border=0 width="36" height="41"></a></td>