PetoleTeam
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
14
3 juil. 2007 à 19:25
B
onjour...
La déclaration de style telle que tu l'as faite fait que le DIV masquage prend 100% de la fenêtre visible du DIV contenu.
Je ne sais si il y a un moyen avec CSS de contourner ce problème, mais il en existe un en javascript.
Une fois le document chargé il faut redimensionner le DIV masquage à la vrai hauteur du DIV contenu.
Voici un petit script complet qui permet de réaliser cela
<html>
<style type= "text/css">
#contenu {
width : 680px;
height : 560px;
margin-top : 0px;
margin-left : 0px;
overflow : auto;
float : left;
position : relative;
background-color : yellow;
}
#masquage {
margin : 0px;
height : 1px;
width : 95%;
position : absolute;
top : 0px;
float : left;
z-index : 2;
background-color : red;
}
</style>
<script type="text/javascript" language="JavaScript">
//--------------------
function Ajuste_Haut(){
//-- Recup les Objets
var Obj_1 = document.getElementById( "contenu");
var Obj_2 = document.getElementById( "masquage");
//-- Lecture des Hauteurs
var Haut_1 = Obj_1.offsetHeight;
var Haut_2 = Obj_2.offsetHeight;
//-- Si partie overflow conteneur
if( Obj_1.scrollHeight > Haut_1)
Haut_1 = Obj_1.scrollHeight;
//-- Ajuste hauteur contenu
Obj_2.style.height = Haut_1 +"px";
}
//---------------------------------------------
function Add_Event( obj_, event_, func_, mode_){
if( obj_.addEventListener)
obj_.addEventListener( event_, func_, mode_? mode_:false);
else
obj_.attachEvent( 'on'+event_, func_);
}
// ======================================
//-- On ajoute levenement sur le onload de window
Add_Event( window, 'load', Ajuste_Haut);
</script>
</head>
<script type="text/javascript" language="JavaScript">
for( i=0; i <100; i++) document.write( "test " +i +"
");
</script>
</html>
S'il y a besoin d'explication complémentaire...
;0)