Hola.. tengo un div contenedor con 10 divs dentro.. lo que trato de hacer es que cuando haga mouse over sobre uno de los divs de adentro se agrande pero sin desplazar los divs vecinos que tambien estan dentro del contenedor alguien seria tan amable de iluminarme con esto?
les dejo la dire para que lo vean como anda.. http://www.nicolasroma.com.ar/HTML/A0001.html
Código:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<style>
.gral { width:540px; background-color:#00CC33; margin:auto; padding:5px; overflow:auto;}
.box { height:80px; width:80px; background-color:#66FF33; margin:5px; float:left; }
</style>
</head>
<body>
<div class='gral'>
<div class="box">
</div>
<div class="box">
</div>
<div class="box">
</div>
<div class="box">
</div>
<div class="box">
</div>
<div class="box">
</div>
<div class="box">
</div>
<div class="box">
</div>
<div class="box">
</div>
<div class="box">
</div>
<div class="box">
</div>
<div class="box">
</div>
</div>
<script type="text/javascript">
var box = document.getElementsByTagName('div');
function agrandar(){ this.style.width = '100px'; this.style.height = '100px'; }
function achicar(){ this.style.width = '80px'; this.style.height = '80px'; }
for (i=1;i<box.length;i++)
{
box[i].onmouseover = agrandar;
box[i].onmouseout = achicar;
}
</script>
</body>
</html>