Ne fonctionne pas sous IE

Le
Le Fou
Bon, mon précédent fil partant sur OS X, Linux etc. J'en ouvre un autre
beaucoup plus SIMPLE ;-)

Ce bout de code HTLM tout bête :

= Début code =
<html>
<head>

<style type="text/css">

.lightbox {
display: none;
}

.lightbox:target {
display: block;
}

</style>

</head>
<body>

<a href="#cible1"><img src="images/annonces/p_Jeunes_01.jpg"></a>

<div class="lightbox" id="cible1">
<img src="images/annonces/Jeunes_01.jpg" alt="Jeunes">
</div>

</body>
</html>
= Fin code =

Fait apparaitre une grande image quand on clique sur une petite et
utilise la pseudo-classe "target".
Fonctionne parfaitement sous Firefox.

Ne fonctionne pas sous IE9.
Pourquoi ?

La page est visible ici :
<http://ffessm.cd84.free.fr/_test_lightbox.htm>

Merci.

--
A' tchao

Le Fou
http://shippylelivre.free.fr/
http://www.ffessm-cd84.com/
Vidéos High-Tech et Jeu Vidéo
Téléchargements
Vos réponses
Gagnez chaque mois un abonnement Premium avec GNT : Inscrivez-vous !
Trier par : date / pertinence
Olivier Miakinen
Le #26322093
Bonjour,

Le 10/11/2014 20:18, Le Fou a écrit :
Bon, mon précédent fil partant sur OS X, Linux etc. J'en ouvre un autre
beaucoup plus SIMPLE ;-)

Ce bout de code HTLM tout bête :

========== Début code ========= > <html>



Tu devrais commencer par mettre un DOCTYPE, si ça se trouve ça suffira
à faire fonctionner la page sur IE. Je me rappelle qu'à l'époque où je
m'y intéressais, c'est-à-dire environ à l'arrivée d'IE6, le fait de ne
pas trouver de DOCTYPE (ou un DOCTYPE incorrect) le faisait passer dans
une sorte de mode de comptabilité avec IE5, avec tous les bugs liés à
cette version antédiluvienne.

<head>

<style type="text/css">

.lightbox {
display: none;
}

.lightbox:target {
display: block;
}

</style>

</head>



Tu n'as pas mis de TITLE dans ton HEAD alors que c'est obligatoire.
Peut-être aussi une source de problème.

<body>




Là il y a une autre erreur, l'absence d'attribut alt, mais je ne
pense pas que ça puisse être l'origine d'un bug.

La page est visible ici :



Cordialement,
--
Olivier Miakinen
SAM
Le #26322222
Le 10/11/14 20:18, Le Fou a écrit :

Ne fonctionne pas sous IE9.
Pourquoi ?



Je n'ai pas IE mais Mozilla dit que ça doit fonctionner avec IE.9

La page est visible ici :




Peut-être essayer de donner une taille (styles width et height) au div à
révéler ?


Ça aide bien les IE qu'ils aient le "Layout"
(voir la Bke de Données de M$ à propos de "HasLayout")
(voir aussi alsacreations avec même sujet)



M'enfin ... ça ne devrait pas fonctionner avec les IE <9

Cordialement,
--
Stéphane Moriaux avec/with iMac-intel 27" & Mac OS X 10.6.8
SAM
Le #26322231
Le 10/11/14 20:18, Le Fou a écrit :

La page est visible ici :



Ce "truc" là d'agrandi n'a un intérêt que très limité !
Dans la mesure où, de toutes façons, la grande vue est chargée à
l'ouverture de la page !

Autant ne se servir que d'elle et en modifier la taille au survol:


css :
==== .vue { text-decoration: none; border: none; }
.vue img { width: 210px }
.vue:hover img { width: 640px; }

html:
====



Mais il serait plus à propos d'utiliser une image de background qui,
elle, ne sera chargée qu'à la demande
(avec un temps de latence surtout pour les visiteurs avec ADSL lent)

css :
==== .vue { text-decoration: none; border: none; }
.vue img { width: 210px; height: 141px;
bakground:url(petite.jpg) no-repeat center center; }
.vue:hover img { width: 640px; height: 430px;
background-image:url(grande.jpg); }

html:
====
'vide.gif' est une image transparente N/B de 1 pixel


Cordialement,
--
Stéphane Moriaux avec/with iMac-intel 27" & Mac OS X 10.6.8
SAM
Le #26322230
Le 10/11/14 20:18, Le Fou a écrit :

La page est visible ici :



voir modifs ici :


Cordialement,
--
Stéphane Moriaux avec/with iMac-intel 27" & Mac OS X 10.6.8
SAM
Le #26322234
Le 11/11/14 16:13, SAM a écrit :

voir modifs ici :


et modifs en variante :


Cordialement,
--
Stéphane Moriaux avec/with iMac-intel 27" & Mac OS X 10.6.8
SAM
Le #26322260
Le 11/11/14 16:26, SAM a écrit :

et un p'tit dernier pour la route :




Toujours pas testé sous IE (que je n'ai pas)

Cordialement,
--
Stéphane Moriaux avec/with iMac-intel 27" & Mac OS X 10.6.8
Le Fou
Le #26322289
Le 11/11/2014 18:45, SAM a écrit :
et un p'tit dernier pour la route :

Toujours pas testé sous IE (que je n'ai pas)



Alors, sous IE9 :

voir modifs ici :


- Fonctionne, mais...
L'image s'agrandit dès que le curseur de la souris survole la page
(n'importe quel endroit) ;-)


et modifs en variante :


- Fonctionne mais sans les effets de transition.





- Fonctionne à moitié, l'image "petit format" n'est pas visible.


Je garde tes exemples sous le coude, ils sont sympas mais ce que je
souhaite c'est vraiment faire fonctionner la pseudo-classe "target" avec
MON IE9.
Car ceci n'est qu'un exemple, même en essayant de modifier le background
d'un DIV ou la couleur u texte et. ça ne fonctionne pas avec MON IE9 et
ça m'énerve ;-)

Merci.

--
A' tchao

Le Fou
http://shippylelivre.free.fr/
http://www.ffessm-cd84.com/
Le Fou
Le #26322288
Le 10/11/2014 22:33, Olivier Miakinen a écrit :

Tu devrais commencer par mettre un DOCTYPE, si ça se trouve ça suffira
à faire fonctionner la page sur IE. Je me rappelle qu'à l'époque où je
m'y intéressais, c'est-à-dire environ à l'arrivée d'IE6, le fait de ne
pas trouver de DOCTYPE (ou un DOCTYPE incorrect) le faisait passer dans
une sorte de mode de comptabilité avec IE5, avec tous les bugs liés à
cette version antédiluvienne.



J'ai rapidement essayé avec un DOCTYPE "4.01 Transitional", ça
fonctionne en local mais pas en ligne...

J'essayerai demain avec d'autres DOCTYPEs.

Merci.

--
A' tchao

Le Fou
http://shippylelivre.free.fr/
http://www.ffessm-cd84.com/
Olivier Miakinen
Le #26322309
Le 11/11/2014 20:39, Le Fou a écrit :

J'ai rapidement essayé avec un DOCTYPE "4.01 Transitional", ça
fonctionne en local mais pas en ligne...



Alors ça, c'est bizarre. Vérifie d'une part que la page a bien été
transférée (c'est un piège qui arrive plus souvent qu'on ne le croit)
et d'autre part que l'ancienne page n'est pas restée en cache, soit
dans ton navigateur, soit sur un éventuel proxy.

J'essayerai demain avec d'autres DOCTYPEs.



Pour être sûr que c'est la bonne page, ajoute un texte quelconque.
Le Fou
Le #26322354
Le 11/11/2014 22:37, Olivier Miakinen a écrit :

Alors ça, c'est bizarre. Vérifie d'une part que la page a bien été
transférée (c'est un piège qui arrive plus souvent qu'on ne le croit)
et d'autre part que l'ancienne page n'est pas restée en cache, soit
dans ton navigateur, soit sur un éventuel proxy.



Bon bin... J'y comprends rien non-plus.
Avec un DOCTYPE ça fonctionne en local mais pas en ligne !

Essais effectués avec les DOCTYPEs :
- HTML 4.01 Transitional
- HTML 4.01 Strict
- HTML 4.0 Transitional
- HTML 4.0 Strict
- HTML 5 (<!DOCTYPE html>)


Je vais finir par croire que ma version de IE9 est daubée ;-)

--
A' tchao

Le Fou
http://shippylelivre.free.fr/
http://www.ffessm-cd84.com/
Publicité
Poster une réponse
Anonyme