Bonjour,
ayant aperçu un grand nombre de personne ayant des difficultés à obtenir des blocs de même hauteur sans bidouiller des images.
Je met un petit javascript qui permet d'avoir des colonnes de même hauteur :
Il requit un tableau d'éléments (div ou autre) possédant les propriétés offsetHeight et style.height.
Tous les éléments sont calibrés par rapport au premier.
Le chargment peut se faire avec un
Voici un exemple pour les tests :
Modifié par mystercoco (24 May 2007 - 15:43)
ayant aperçu un grand nombre de personne ayant des difficultés à obtenir des blocs de même hauteur sans bidouiller des images.
Je met un petit javascript qui permet d'avoir des colonnes de même hauteur :
<script language="javascript">
function memehauteur(tab)
{ //met tous le objets à la même hauteur que le premier
lg=tab.length;
if (lg<2) return false;
siz=tab[0].offsetHeight+'px';
for (i=1;i<lg;i++)
tab[i].style.height=siz;
}
</script>Il requit un tableau d'éléments (div ou autre) possédant les propriétés offsetHeight et style.height.
Tous les éléments sont calibrés par rapport au premier.
Le chargment peut se faire avec un
<body onload="memehauteur([objetDIV1, objetDIV2, objetDIV3])">Voici un exemple pour les tests :
<html>
<head>
<STYLE TYPE="text/css">
.gauche
{
float: left;
width: 20%;
background-color: #00FF00;
}
.droite
{
background-color: #FF0000;
width: 80%;
float: right;
min-height: 400px;
_height: 400px;
}
</STYLE>
</head>
<body onload="memehauteur([document.getElementById('droite'),document.getElementById('gauche')])">
<script language="javascript">
function memehauteur(tab)
{ //met tous le objets à la même hauteur que le premier
lg=tab.length;
if (lg<2) return false;
siz=tab[0].offsetHeight+'px';
for (i=1;i<lg;i++)
tab[i].style.height=siz;
}
</script>
<div class="gauche" id="gauche">
</div>
<div class="droite" id="droite">
<br/>
<br/>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/>
</div>
</body>
</html>
Modifié par mystercoco (24 May 2007 - 15:43)