hola todos gracias por sus comentarios me estan acercando mas a lo que deseo hacer ahora tengo otros problemillas:
modificando lo q me han explicado he logrado que la etiqueta div tenga un fondo q seria el diseño q quiero q se despliegue pero el objetivo es q dentro de esta tambien hayan otras pequeñas DIV´s q tengan logos como los de blogs por ejemplo pero como empezando el efecto de transition la Div q los contiene esta en una dimension mas pequeña no puedo poner las de adentro en una posicion adecuada y si redimensiono la grande entonces qdarian como por debajo ed la pantalla eso las haria verse antes de q todo el efecto suceda..... q podria hacer para ocultarlas cuando la grande este aun sin aparecer??
Cita: #abajo
{
width: 381px;
height:50px;
font-size:14px;
color:#FFF;
text-align:center;
}
#abajo
{
position:absolute;
left:109px;
bottom:144px;
transition:height 1s;
-moz-transition:height 1s;
-webkit-transition:height 1s;
-o-transition:height 1s;
background-image: url(pesta%C3%B1ainferior.png);
}
#abajo:hover
{
height:600px;
}
#apDiv1 {
position:absolute;
left:86px;
top:315px;
width:62px;
height:38px;
z-index:1;
}
#apDiv2 {
position:absolute;
left:163px;
top:315px;
width:65px;
height:43px;
z-index:2;
}
</style>
</head>
<body>
<div id="abajo">
<img src="imagenes estructura/imagenes de HOME/blogs (5).png" width="47" height="40" />
<img src="imagenes estructura/imagenes de HOME/blogs (3).png" width="48" height="44" />
</div>
</body>
</html>