Bonjour à tous,
je planche sur une technique de zone visible d'une image redimensionnable en plein écran via un masque sous forme de div.
J'utilise la technique overflow hidden avec mon premier div (un wrapper) qui englobe le tout.
Voici mon code html (technique de plein écran redimensionnable avec un tableau):
<div class="bgBloc">
<div class="bgBis">
<div>
<table cellspacing="0" cellpadding="0">
<tr>
<td>
<img src="images/bg02Bis.jpg" alt=""/>
</td>
</tr>
</table>
</div>
</div>
</div>
et mon css :
.bgBis, .bgBis table, .bgBis td {
height:100%;
width:100%;
overflow:hidden;
}
.bg {
position:absolute;
z-index:1;
}
.bgBis div {
height:200%;
left:-50%;
position:fixed;
top:-50%;
width:200%;
}
.bgBis td {
text-align:center;
vertical-align:middle;
}
.bgBis img {
margin:0 auto;
min-height:50%;
min-width:50%;
display:block;
}
Voilà, une personne pourrait m'éclairer ?
Merci !
je planche sur une technique de zone visible d'une image redimensionnable en plein écran via un masque sous forme de div.
J'utilise la technique overflow hidden avec mon premier div (un wrapper) qui englobe le tout.
Voici mon code html (technique de plein écran redimensionnable avec un tableau):
<div class="bgBloc">
<div class="bgBis">
<div>
<table cellspacing="0" cellpadding="0">
<tr>
<td>
<img src="images/bg02Bis.jpg" alt=""/>
</td>
</tr>
</table>
</div>
</div>
</div>
et mon css :
.bgBis, .bgBis table, .bgBis td {
height:100%;
width:100%;
overflow:hidden;
}
.bg {
position:absolute;
z-index:1;
}
.bgBis div {
height:200%;
left:-50%;
position:fixed;
top:-50%;
width:200%;
}
.bgBis td {
text-align:center;
vertical-align:middle;
}
.bgBis img {
margin:0 auto;
min-height:50%;
min-width:50%;
display:block;
}
Voilà, une personne pourrait m'éclairer ?
Merci !