Código en javascript para esta imagen

axav · #1 (**permalink**) 07/08/2010, 11:29

Hola muy buenas, estoy creando una sección en mi pagina web de descargas y lo que quiero hacer es lo siguiente:

Imagen:

Bien esta imagen, son dos en realidad, la azul que dice: Mozilla Firefox y la de color gris que dice: descargar.

Lo que quiero hacer es que solo se vea la imagen mozilla firefox y la imagen descargar no se vea y al presionar en mozilla firefox baje lentamente la imagen "descargar" para poder descargar el producto.

Pongo dos imagenes para mas detalle:

Imagen predeterminada cerrada:

Al pinchar en la imagen "Mozilla Firefox", la imagen "Descargar" se baja para poder descargar el producto:

Haber si alguien me puede echar una mano, de que manera puedo hacerlo, me temo que es con algun tipo de script, por ello es que lo postee en esta seccion.

Gracias.

GastonManatico · #2 (**permalink**) 07/08/2010, 12:04

Cita:

Iniciado por axav

Hola muy buenas, estoy creando una sección en mi pagina web de descargas y lo que quiero hacer es lo siguiente:

Imagen:

Bien esta imagen, son dos en realidad, la azul que dice: Mozilla Firefox y la de color gris que dice: descargar.

Lo que quiero hacer es que solo se vea la imagen mozilla firefox y la imagen descargar no se vea y al presionar en mozilla firefox baje lentamente la imagen "descargar" para poder descargar el producto.

Pongo dos imagenes para mas detalle:

Imagen predeterminada cerrada:

Al pinchar en la imagen "Mozilla Firefox", la imagen "Descargar" se baja para poder descargar el producto:

Haber si alguien me puede echar una mano, de que manera puedo hacerlo, me temo que es con algun tipo de script, por ello es que lo postee en esta seccion.

Gracias.

Seguramente eso lo podes lograr con JQuery , ...

soy principiante en programacion solo te podria decir como hacerlo pero en vez de que vaya bajando simplemente que aparesca al clikear la primer imagen =/

saludos..

GastonManatico · #3 (**permalink**) 07/08/2010, 13:02

Código PHP:

  <html>
<head>
<script language="javascript">
function mostrar(){
/*Se reemplaza el div "botondescargar" por el div "botonaparece"*/
document.getElementById('botondescargar').innerHTML ="<div id='botonaparece'></div>";
}
</script>
<style>

#imagenfirefox{
background-color:#CCCCCC;
width:200px;
height:100px;
}

#botondescargar{

width:200px;
height:80px;
margin-top:10px;

}
/*ACA TENES QUE PONER LA IMAGEN DE DESCARGAR*/
#botonaparece{

background-color:#CC0000;
width:200px;
height:80px;
margin-top:10px;

}
</style>
</head>
<body>
<div id="imagenfirefox" onclick="mostrar()">IMAGEN MOZILA FIREFOXs</div> <!--Aca estaria la imagen que dice firefox  -->
<div id="botondescargar"></div><!--Este div no se ve --> 
</body>
</html>

SI NO ENTENDES ALGO AVISAME

caricatos · #4 (**permalink**) 07/08/2010, 20:14

Cita:

Iniciado por GastonManatico

Seguramente eso lo podes lograr con JQuery , ...

saludos..

...Y ¿porqué depender de una librería si con javascript "normal" se puede?

Creo que hay demasiada dependencia de estas librerías.

Saludos

GastonManatico · #5 (**permalink**) 07/08/2010, 20:16

Cita:

Iniciado por caricatos

...Y ¿porqué depender de una librería si con javascript "normal" se puede?

Creo que hay demasiada dependencia de estas librerías.

Saludos

es cierto , debo seguir aprendiendo