Ver Mensaje Individual
  #1 (permalink)  
Antiguo 12/11/2008, 04:26
Avatar de Shagraarath
Shagraarath
 
Fecha de Ingreso: agosto-2008
Mensajes: 151
Antigüedad: 15 años, 9 meses
Puntos: 1
Información [Codigo completo 100%] - Rollover ( varias imagenes en una )

Porfin consegui hacer el codigo para el Rollover con varias imagenes en una.
El Rollover empieza cuando el cursor esta encima de la imagen y vuelve a la imagen inicial cuando esta fuera.

Me costo pero ya esta ^^ gracias a todos los que me ayudaron.

CODIGO ROLLOVER ( varias imagenes )
Código HTML:
/*****************************************************************************
Presentación de Imágenes2 (SlideShow) por Tunait! 6/agosto/03
Actualizado el 28/12/2003
Si quieres usar este script en tu sitio eres libre de hacerlo con la condición de que permanezcan intactas estas líneas, osea, los créditos.

http://javascript.tunait.com
[email protected] 
******************************************************************************/

/MODIFICADO POR: 
Shagraarath
[email protected]

QUE HACE DE NUEVO?:
Ahora este código hace un rollover con "n" imagenes utilizando Onmouseover/out volviendo
el contador a 0 cuando es "out".

Respeten los creditos.

******************************************************************************/
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sin t&iacute;tulo</title>
<script type="text/javascript">
var segundos = 1 
var dire = "fotos" 

var imagenes=new Array()
	imagenes[0]="3.jpg"
	imagenes[1]="2.jpg"

if(dire != "" && dire.charAt(dire.length-1) != "/")
	{dire = dire + "/"}
var preImagenes = new Array()
for (pre = 0; pre < imagenes.length; pre++){
	preImagenes[pre] = new Image()
	preImagenes[pre].src = dire + imagenes[pre]
}
cont=0
function presImagen(){
	document.foto.src= dire + imagenes[cont]
	subeOpacidad()
	if (cont < imagenes.length-1)
		{cont ++}
	else
		{cont=0}
	tiempo=window.setTimeout('bajaOpacidad()',segundos*1000)
	
}
var iex = navigator.appName=="Microsoft Internet Explorer" ? true : false;
var fi = iex?'filters.alpha.opacity':'style.MozOpacity'
var opa = iex ? 100 : 1;
function bajaOpacidad(){
	opa = 0
	cambia()
	presImagen()
}

function subeOpacidad(){
	opaci = iex?100:1;
	if(opa <= opaci){
		cambia()
		opa += iex?10: 0.1;
		var opac
		opac = setTimeout('subeOpacidad()',10)
	}
}
function cambia(){
	eval('document.foto.' + fi + ' = opa')
}
var tiempo
function inicio(){
	tiempo
	bajaOpacidad()
}
function final(){
	clearTimeout(tiempo)
	document.foto.src="1.jpg"
	cont = 0
}
</script>
</head>

<body>
<img src="1.jpg" name="foto" id="foto" alt="alena y juan" onmouseover="inicio()" onmouseout="final()" width="200" height="200">
</body>
</html> 

Última edición por Shagraarath; 17/11/2008 a las 05:08