Comunidad de diseño web y desarrollo en internet online

Banner con javascrip, html y css

Citar            
MensajeEscrito el 26 Ago 2016 09:58 pm
Hola me podrian ayudar con la siguiente tematica:
Las imagenes las puedes tomar de bestbuy de productos aleatorios o inclusive usar servicios como http://placehold.it/

Cuando se haga hover en la tabla de imagenes abajo se debe de cambiar la imagen de producto. (perdon pero no pude subir la imagen pero explicare como:


La imagenque se debe mostrar al pasar el mouse
:oops:
y a qui la explicacion de la imagen


en una tabla en donde se debe mostrar arriaba la imagen
:oops: :cry: :roll:
:) :o :?


solo encontre un codigo que si me sirve pero no puedo mover la imagen que se muestra
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" type="text/css" href="est/mov.css">
<title>Documento sin t&iacute;tulo</title>
</head>
</div>
<body>
<div id="contenedor">

<a href="javascript:void(0);" class="miniatura">
<img src="imagenes/1.jpg" alt="" style="width:100px;" />
<span><img src="imagenes/2.jpg" alt=""/></span></a>


</div>
</body>
</html>
---------------------------------------------------CSS
/* CSS Document */
/* CSS Document */

#contenedor {
position:absolute;
}
.miniatura{
y-index: 1001;
text-decoration: none;
}
.miniatura img {
border: 0px;
}
.miniatura span {
position:inherit;
text-decoration: none;
visibility:hidden;
border: 0px;
top:-500px;
//*left:-40px;*//
above:0px;
}
.miniatura:hover span {
visibility: visible;
overflow:visible;
y-index: 10002;
}

Espero que me ayuden y si necesitan mas explicacion con gusto, gracias

Por RociiioGz

0 de clabLevel



 

chrome
Citar            
MensajeEscrito el 26 Ago 2016 11:15 pm
Te refieres a los Sprites... una imagen grande con muchas imagenes las cuales se mueven al poner el mouse encima y asi ?

Por elporfirio

Claber

652 de clabLevel

1 tutorial

Genero:Masculino  

FullStack Web Developer

chrome

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.