Affichage different sous internet explorer et
Fermé
johann91610
-
6 déc. 2007 à 00:37
johann91610 Messages postés 3 Date d'inscription jeudi 6 décembre 2007 Statut Membre Dernière intervention 13 août 2008 - 6 déc. 2007 à 00:44
johann91610 Messages postés 3 Date d'inscription jeudi 6 décembre 2007 Statut Membre Dernière intervention 13 août 2008 - 6 déc. 2007 à 00:44
A voir également:
- Affichage different sous internet explorer et
- Telecharger internet explorer - Télécharger - Navigateurs
- Internet explorer 8 - Télécharger - Navigateurs
- Internet explorer 9 - Télécharger - Navigateurs
- Explorer patcher - Télécharger - Personnalisation
- Ouvrir internet explorer - Guide
1 réponse
johann91610
Messages postés
3
Date d'inscription
jeudi 6 décembre 2007
Statut
Membre
Dernière intervention
13 août 2008
6 déc. 2007 à 00:44
6 déc. 2007 à 00:44
Enfaite je vous 'explique, pour créer ma galerie je me suis servis d'un logiciel qui s'appel Jalbum puis sa ma donné sa comme résultat:
http://johann91610.free.fr/probleme/jalbum.JPG
Ensuite j'ai voulu adapté le code pour pouvoir le mettre dans mon site, voici le css qui gère ma galerie photo si vous voulez jeter un œil, je n'ai pas nettoyer les choses inutiles encore:
[Code]
#lightbox{
position: absolute;
left: 0;
width: 100%;
z-index: 100;
text-align: center;
line-height: 0;
}
#lightbox a img{ border: none; }
#outerImageContainer{
position: relative;
background-color: #fff;
width: 250px;
height: 250px;
margin: 0 auto;
}
#imageContainer{
padding: 10px;
}
#loading{
position: absolute;
top: 40%;
left: 0%;
height: 25%;
width: 100%;
text-align: center;
line-height: 0;
background-image: url(images/loading.gif);
background-repeat: no-repeat;
background-position: center;
}
#hoverNav{
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
z-index: 10;
}
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}
#prevLink, #nextLink{
width: 49%;
height: 100%;
background: transparent url(images/blank.gif) no-repeat; /* Trick IE into showing hover */
display: block;
}
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(images/nextlabel.gif) right 15% no-repeat; }
#imageDataContainer{
font: 10px Verdana, Helvetica, sans-serif;
background-color: #fff;
margin: 0 auto;
line-height: 1.4em;
overflow: auto;
width: 100%
}
#imageData{ padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }
#imageData #caption{ font-weight: bold; }
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em; }
#imageData #bottomNavClose{
width: 66px;
float: right;
margin: 1em;
background-image: url(images/closelabel.gif);
background-repeat: no-repeat;
height: 22px;
}
#overlay{
position: absolute;
top: 0;
left: 0;
z-index: 90;
width: 100%;
height: 500px;
background-color: #000;
}
/* * * * * V 0.3 * * * * * /
/* html,body thanks to Torben - <a href="http://blog.schreiter.info/" target="_blank">blog.schreiter.info...</a> */
html, body {
height:100%;
min-height:100%;
}
#imageContainer{
padding: 10px;
}
a:link {
text-decoration: none;
color: #333;
text-align: center;
font-size: 14px;
}
.imageContainertable {
font-size: 14px;
color: #333333;
text-align: center;
font-style: normal;
font-weight: normal;
font-family: "Times New Roman", Times, serif;
}
a:visited {
text-decoration: none;
}
a:hover {
text-decoration: none;
color: #f78614;
}
a:active {
text-decoration: none;
}
h1 {
color: #333;
font-size: 20px;
}
[/code]
Merci
http://johann91610.free.fr/probleme/jalbum.JPG
Ensuite j'ai voulu adapté le code pour pouvoir le mettre dans mon site, voici le css qui gère ma galerie photo si vous voulez jeter un œil, je n'ai pas nettoyer les choses inutiles encore:
[Code]
#lightbox{
position: absolute;
left: 0;
width: 100%;
z-index: 100;
text-align: center;
line-height: 0;
}
#lightbox a img{ border: none; }
#outerImageContainer{
position: relative;
background-color: #fff;
width: 250px;
height: 250px;
margin: 0 auto;
}
#imageContainer{
padding: 10px;
}
#loading{
position: absolute;
top: 40%;
left: 0%;
height: 25%;
width: 100%;
text-align: center;
line-height: 0;
background-image: url(images/loading.gif);
background-repeat: no-repeat;
background-position: center;
}
#hoverNav{
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
z-index: 10;
}
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}
#prevLink, #nextLink{
width: 49%;
height: 100%;
background: transparent url(images/blank.gif) no-repeat; /* Trick IE into showing hover */
display: block;
}
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(images/nextlabel.gif) right 15% no-repeat; }
#imageDataContainer{
font: 10px Verdana, Helvetica, sans-serif;
background-color: #fff;
margin: 0 auto;
line-height: 1.4em;
overflow: auto;
width: 100%
}
#imageData{ padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }
#imageData #caption{ font-weight: bold; }
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em; }
#imageData #bottomNavClose{
width: 66px;
float: right;
margin: 1em;
background-image: url(images/closelabel.gif);
background-repeat: no-repeat;
height: 22px;
}
#overlay{
position: absolute;
top: 0;
left: 0;
z-index: 90;
width: 100%;
height: 500px;
background-color: #000;
}
/* * * * * V 0.3 * * * * * /
/* html,body thanks to Torben - <a href="http://blog.schreiter.info/" target="_blank">blog.schreiter.info...</a> */
html, body {
height:100%;
min-height:100%;
}
#imageContainer{
padding: 10px;
}
a:link {
text-decoration: none;
color: #333;
text-align: center;
font-size: 14px;
}
.imageContainertable {
font-size: 14px;
color: #333333;
text-align: center;
font-style: normal;
font-weight: normal;
font-family: "Times New Roman", Times, serif;
}
a:visited {
text-decoration: none;
}
a:hover {
text-decoration: none;
color: #f78614;
}
a:active {
text-decoration: none;
}
h1 {
color: #333;
font-size: 20px;
}
[/code]
Merci
