Foros del Web - Ver Mensaje Individual

KarlanKas · #5 (**permalink**) 07/04/2003, 08:13

Mucho me temo uqe has tirado del primer ejemplo sin leer más... no te preocupes, prueba este ejemplo. Igual es un poco más complicado pero para lo tuyo viene muy bien:

Código PHP:

  <html>

<head>

 
    <script>

    

    var imagen=new Array;

    imagen[0]=new Image;

    imagen[0].no=new Image();

    imagen[0].pincha=new Image();

    imagen[0].si=new Image();

    

    imagen[1]=new Image;

    imagen[1].no=new Image();

    imagen[1].pincha=new Image();

    imagen[1].si=new Image();

 
    imagen[2]=new Image;

    imagen[2].no=new Image();

    imagen[2].pincha=new Image();

    imagen[2].si=new Image();

 
    imagenAnterior=new Image;

    

    var numeroAnterior=0

//--------- PON AQUÍ LA RUTA DE LAS IMÁGENES (NO HAN DE SER ABSOLUTAS)---------------

    

    imagen[0].no.src="no.gif";

    imagen[0].pincha.src="hazclick.gif";

    imagen[0].si.src="si.gif";

    

    imagen[1].no.src="no1.gif";

    imagen[1].pincha.src="hazclick1.gif";

    imagen[1].si.src="si1.gif";

    

    imagen[2].no.src="no2.gif";

    imagen[2].pincha.src="hazclick2.gif";

    imagen[2].si.src="si2.gif";

    

    

 
//------------------------------------------------------------------------------------    

    function cliqueo(esto,numero){

    imagenAnterior.src=imagen[numeroAnterior].no.src;

    imagenAnterior=esto;

    numeroAnterior=numero

    esto.src=(esto.src!=imagen[numero].si.src)?imagen[numero].si.src:imagen[numero].no.src;

    }

    

    </script>

    </head>

 
<body>

<a onfocus="this.blur()" href=#>

    <img     

            border=0 

            src="no.gif" 

            onclick="cliqueo(this,0)"

            onmouseover="if (this.src==imagen[0].no.src){this.src=imagen[0].pincha.src}"

            onmouseout="if (this.src==imagen[0].pincha.src){this.src=imagen[0].no.src}"

            >

</a>

 
<a onfocus="this.blur()" href=#>

    <img     border=0 

            src="no1.gif" 

            onclick="cliqueo(this,1)"

            onmouseover="if (this.src==imagen[1].no.src){this.src=imagen[1].pincha.src}"

            onmouseout="if (this.src==imagen[1].pincha.src){this.src=imagen[1].no.src}"

            >

</a>

 
<a onfocus="this.blur()" href=#>

    <img     border=0 

            src="no2.gif" 

            onclick="cliqueo(this,2)"

            onmouseover="if (this.src==imagen[2].no.src){this.src=imagen[2].pincha.src}"

            onmouseout="if (this.src==imagen[2].pincha.src){this.src=imagen[2].no.src}"

            >

</a>

</body>

</html>

Ves que hay varios elementos imagen en el array, hay uno por cada enlace, de forma que puedes personalizar cada enlace como quieras (con una imagen para cada click, mouseover y omuyseout). Con estos cambios se consigue lo uqe tú pedías que es que se ponga en no cuando pinches en otra imagen.

Para manejarlo sólo tienes que cambiar las rutas de las imágenes en la lista de la ruta de las mismas que está debajo de "PON AQUÍ LA RUTA DE LAS IMÁGENES (NO HAN DE SER ABSOLUTAS)" y ya está.

Si quieres poner más enlaces sólo tienes que añadir un imagen[3] siguiendo el ejemplo de las anteriores.

Si tienes cualquier duda pregunta que e ayudo con mucho gusto.

Un saludo!