Javascript Internet Explorer et opéra

Résolu/Fermé
hellboy42 Messages postés 177 Date d'inscription mercredi 1 octobre 2008 Statut Membre Dernière intervention 25 octobre 2014 - 1 oct. 2008 à 21:15
nEm3sis Messages postés 710 Date d'inscription lundi 20 août 2007 Statut Membre Dernière intervention 9 avril 2012 - 17 oct. 2008 à 20:34
Bonjour,

Actuellement en train de réaliser un site web en PHP, html et javascript je suis confronté à un réel problème.... Après des heures de recherches j'ai abandonné mon idée.

J'aurais donc besoin d'un petit coup de pouce svp !


==>http://www.heavenofaion.hbg.fr

Certaines pages de mon site n'affichent aucune image lorsque j'insère des animations gif en javascript avec un document.write ( seulement sous Internet Explorer et opéra.)

Cela fonctionne parfaitemment avec Safari et Firefox.

De plus, mes images, s'adaptent selon plusieurs résolutions d'écrans d'ou les if, else....

Voici mon code pour mes deux pages(index et accueil ) en question qui ne fonctionnent pas sous IE et opéra:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
<head>
<title>Video Games Forever</title>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" media="screen" type="text/css" title="Design" href="PHP/CSS/introcss.css" />


</head>

<body>

<div id="imgintro">
<script language="javascript">

if (screen.width == 800) {
document.write("<a href='accueil.php' <img src='PHP/Images/Intro/800/intro0.gif'></a>");
} if (screen.width == 1024) {
document.write("<a href='accueil.php' <img src='PHP/Images/Intro/1024/intro0.gif'></a>");
} if (screen.width == 1280) {
document.write("<a href='accueil.php' <img src='PHP/Images/Intro/1280/intro0.gif'></a>");
}

if (screen.width == 1440) {
document.write("<a href='accueil.php' <img src='PHP/Images/Intro/1440/intro0.gif'></a>");
}
if (screen.width == 1680) {
document.write("<a href='accueil.php' <img src='PHP/Images/Intro/1680/intro0.gif'></a>");
}

</script>
</div>


<div id="titre">
<script language="javascript">

if (screen.width == 800) {
document.write("<a href='index.php' <img src='PHP/Images/Intro/800/titre.jpeg'></a>");
} if (screen.width == 1024) {
document.write("<a href='index.php' <img src='PHP/Images/Intro/1024/titre.jpeg'></a>");
} if (screen.width == 1280) {
document.write("<a href='index.php' <img src='PHP/Images/Intro/1280/titre.jpeg'></a>");
}

if (screen.width == 1440) {
document.write("<a href='index.php' <img src='PHP/Images/Intro/1440/titre.jpeg'></a>");
}
if (screen.width == 1680) {
document.write("<a href='index.php' <img src='PHP/Images/Intro/1680/titre.jpeg'></a>");
}

</script>

</div>







<object type="application/x-shockwave-flash" data="PHP/Images/dewplayer.swf?son=PHP/zik/acc.mp3&autostart=1"
width="200" height="20" > <param name="movie" value="PHP/Images/dewplayer.swf?son=PHP/zik/acc.mp3/> </object>

</body>
</html>








<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
<head>
<title> Video Games Forever</title>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" media="screen" type="text/css" title="Design" href="PHP/CSS/accueil.css" />


</head>

<body>

<div id="imgdiablo">

<script language="javascript">

if (screen.width == 800) {
document.write("<a href='PHP/diablo3.php' <img src='PHP/Images/Accueil/800/diablozoom.gif'></a>");
} if (screen.width == 1024) {
document.write("<a href='PHP/diablo3.php' <img src='PHP/Images/Accueil/1024/diablozoom.gif'></a>");
} if (screen.width == 1280) {
document.write("<a href='PHP/diablo3.php' <img src='PHP/Images/Accueil/1280/diablozoom.gif'></a>");
}

if (screen.width == 1440) {
document.write("<a href='PHP/diablo3.php' <img src='PHP/Images/Accueil/1440/diablozoom.gif'></a>");
}
if (screen.width == 1680) {
document.write("<a href='PHP/diablo3.php' <img src='PHP/Images/Accueil/1680/diablozoom.gif'></a>");
}

</script>
</div>

<div id="imgwarcraft3">
<script language="javascript">

if (screen.width == 800) {
document.write("<a href='PHP/gw2.php' <img src='PHP/Images/Accueil/800/war3.gif'></a>");
} if (screen.width == 1024) {
document.write("<a href='PHP/gw2.php' <img src='PHP/Images/Accueil/1024/war3.gif'></a>");
} if (screen.width == 1280) {
document.write("<a href='PHP/gw2.php' <img src='PHP/Images/Accueil/1280/war3.gif'></a>");
}

if (screen.width == 1440) {
document.write("<a href='PHP/gw2.php' <img src='PHP/Images/Accueil/1440/war3.gif'></a>");
}
if (screen.width == 1680) {
document.write("<a href='PHP/gw2.php' <img src='PHP/Images/Accueil/1680/war3.gif'></a>");
}
</script>
</div>

<div id="imgstarcraft2">
<script language="javascript">

if (screen.width == 800) {
document.write("<a href='PHP/gw2.php' <img src='PHP/Images/Accueil/800/star2.gif'></a>");
} if (screen.width == 1024) {
document.write("<a href='PHP/gw2.php' <img src='PHP/Images/Accueil/1024/star2.gif'></a>");
} if (screen.width == 1280) {
document.write("<a href='PHP/gw2.php' <img src='PHP/Images/Accueil/1280/star2.gif'></a>");
}

if (screen.width == 1440) {
document.write("<a href='PHP/gw2.php' <img src='PHP/Images/Accueil/1440/star2.gif'></a>");
}
if (screen.width == 1680) {
document.write("<a href='PHP/gw2.php' <img src='PHP/Images/Accueil/1680/star2.gif'></a>");
}
</script> </div>

<div id="imgwow">

<script language="javascript">

if (screen.width == 800) {
document.write("<a href='PHP/diablo3.php' <img src='PHP/Images/Accueil/800/dragon.gif'></a>");
} if (screen.width == 1024) {
document.write("<a href='PHP/diablo3.php' <img src='PHP/Images/Accueil/1024/dragon.gif'></a>");
} if (screen.width == 1280) {
document.write("<a href='PHP/diablo3.php' <img src='PHP/Images/Accueil/1280/dragon.gif'></a>");
}

if (screen.width == 1440) {
document.write("<a href='PHP/diablo3.php' <img src='PHP/Images/Accueil/1440/dragon.gif'></a>");
}
if (screen.width == 1680) {
document.write("<a href='PHP/diablo3.php' <img src='PHP/Images/Accueil/1680/dragon.gif'></a>");
}
</script>

</div>

<div id="imggw2">
<script language="javascript">

if (screen.width == 800) {
document.write("<a href='PHP/gw2.php' <img src='PHP/Images/Accueil/800/sylvariss.gif'></a>");
} if (screen.width == 1024) {
document.write("<a href='PHP/gw2.php' <img src='PHP/Images/Accueil/1024/sylvariss.gif'></a>");
} if (screen.width == 1280) {
document.write("<a href='PHP/gw2.php' <img src='PHP/Images/Accueil/1280/sylvariss.gif'></a>");
}

if (screen.width == 1440) {
document.write("<a href='PHP/gw2.php' <img src='Images/Accueil/1440/sylvariss.gif'></a>");
}
if (screen.width == 1680) {
document.write("<a href='PHP/gw2.php' <img src='PHP/Images/Accueil/1680/sylvariss.gif'></a>");
}
</script>
</div>

<div id="imgaion">


<script language="javascript">

if (screen.width == 800) {
document.write("<a href='PHP/diablo3.php' <img src='PHP/Images/Accueil/800/aion.gif'></a>");
} if (screen.width == 1024) {
document.write("<a href='PHP/diablo3.php' <img src='PHP/Images/Accueil/1024/aion.gif'></a>");
} if (screen.width == 1280) {
document.write("<a href='PHP/diablo3.php' <img src='PHP/Images/Accueil/1280/aion.gif'></a>");
}

if (screen.width == 1440) {
document.write("<a href='PHP/diablo3.php' <img src='PHP/Images/Accueil/1440/aion.gif'></a>");
}
if (screen.width == 1680) {
document.write("<a href='PHP/diablo3.php' <img src='PHP/Images/Accueil/1680/aion.gif'></a>");
}
</script>

</div>

<div id="titre">
<script language="javascript">

if (screen.width == 800) {
document.write("<a href='index.php' <img src='PHP/Images/Accueil/800/titre.gif'></a>");
} if (screen.width == 1024) {
document.write("<a href='index.php' <img src='PHP/Images/Accueil/1024/titre.gif'></a>");
} if (screen.width == 1280) {
document.write("<a href='index.php' <img src='PHP/Images/Accueil/1280/titre.gif'></a>");
}

if (screen.width == 1440) {
document.write("<a href='index.php' <img src='PHP/Images/Accueil/1440/titre.gif'></a>");
}
if (screen.width == 1680) {
document.write("<a href='index.php' <img src='PHP/Images/Accueil/1680/titre.gif'></a>");
}
</script>
</div>




<object type="application/x-shockwave-flash"


data="PHP/Images/dewplayer.swf?son=PHP/zik/shaping.mp3&autostart=1"
width="200" height="20" hidden="true" > <param name="movie" value="PHP/Images/dewplayer.swf?son=PHP/zik/shaping.mp3"/> </object>
</body>
</html>





Je ne vois vraiment pas où est le problème:
- Est-ce une faute dans mon code, une reeur toute bête
- Faut-il rajouter des balises spécifiques pour IE et opéra
- Y'a t-il des options à modifier au niveau du navigateur....

Je rappel que je suis débutant en javascript et espère que quelqu'un pourra m'éclairer !
Merci d'avance.
A voir également:

13 réponses

nEm3sis Messages postés 710 Date d'inscription lundi 20 août 2007 Statut Membre Dernière intervention 9 avril 2012 113
1 oct. 2008 à 23:58
déjà bonjour
j'ai pas regardé en détail car c'est trop long mais j'ai déjà vu ça

<a href='accueil.php' <img src='PHP/Images/Intro/1280/intro0.gif'></a>
tu a oublié de fermer la balise a
<a href='accueil.php'><img src='PHP/Images/Intro/1280/intro0.gif'></a>

je sais pas si ça changera qqch mais au moins ça avance un petit peu



après si c'est le javascript qui plante tu auras un message d'eerreur avec IE
meme si avec firefox ça plante pas vérifie la console d'erreur


heu quand je vais sur ta page avec firefox j'ai une belle page noire avec un player
manque pas qqch ?


edit :
	<script language="javascript">

	if (screen.width == 800) { 
document.write("<a href='accueil.php' <img src='PHP/Images/Intro/800/intro0.gif'></a>");
} if (screen.width == 1024) { 
document.write("<a href='accueil.php' <img src='PHP/Images/Intro/1024/intro0.gif'></a>");
} if (screen.width == 1280) { 
document.write("<a href='accueil.php' <img src='PHP/Images/Intro/1280/intro0.gif'></a>");
} 

if (screen.width == 1440) { 
document.write("<a href='accueil.php' <img src='PHP/Images/Intro/1440/intro0.gif'></a>");
} 
if (screen.width == 1680) { 
document.write("<a href='accueil.php' <img src='PHP/Images/Intro/1680/intro0.gif'></a>");
}
	
	</script> 
et moi qui suis en 1920*1200 j'ai pas le droit a l'image ?
pense a mettre une image pour TOUTES les résolutions en mettant des sinon (else)
0
hellboy42 Messages postés 177 Date d'inscription mercredi 1 octobre 2008 Statut Membre Dernière intervention 25 octobre 2014 1
2 oct. 2008 à 15:05
Merci beaucoup! Mon problème venait effectivement d'un manque de rigeur dans l'écriture; j'avais oublié de fermer toutes mes balises...

En ce qui concerne les résolutions il faut vraiment que je fasse des images pour toutes les résolutions ou vaudrait-il mieux que je fasse un else prévenant l'utilisateur de se mettre en 800, 1024, 1280, 1440 ou 1680??

Je pensais avoir fait les résolutions les plus utilisées...

J'aurais aussi aimez savoir s'il est possible d'enlever les cadres colorés de mes images sous internet explorer et mozilla à part bien sûr de modifier les cadres en la couleur de mon fond?
0
nEm3sis Messages postés 710 Date d'inscription lundi 20 août 2007 Statut Membre Dernière intervention 9 avril 2012 113
4 oct. 2008 à 03:23
"prévenant l'utilisateur de se mettre en 800" ça surtout pas
ce que tu peux faire c'est pour ceux qui ont moins de 1024 tu affiche la page de 800
ceux qui ont moins de 1280 tu affiche la page de 1024
etc ...
et puisque tu a choisi de mettre 1680 en taille max
dans ce cas pour tout ceux qui ont plus tu leur affiche cette page la
comme ça si j'ai une grande résolution (ou une inabituelle) ben j'aurai une page plus petite mais au moins j'aurais quelque chose

J'aurais aussi aimez savoir s'il est possible d'enlever les cadres colorés de mes images sous internet explorer et mozilla à part bien sûr de modifier les cadres en la couleur de mon fond?
pour la je comprend pas trop tu aurais un exemple a montrer ?
0
hellboy42 Messages postés 177 Date d'inscription mercredi 1 octobre 2008 Statut Membre Dernière intervention 25 octobre 2014 1
4 oct. 2008 à 12:29
Pour les cadres colorés autour des images c'est sous internet explorer et firefox; l'exemple de l'accueil :

http://www.heavenofaion.hbg.fr/accueil.php

Si tu ne peux pas y accéder c'est que je n'ai pas modifiez mes problèmes de résolutions. J'essaye de faire cela rapidemment.

Tu me diras ce que tu en penses s tu vois ce que je veux dire.
Merci,

A bientot.
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
hellboy42 Messages postés 177 Date d'inscription mercredi 1 octobre 2008 Statut Membre Dernière intervention 25 octobre 2014 1
4 oct. 2008 à 20:42
J'ai un petit souci; lorsque je fais si résolution inférieure à 1024 afficher mon site en 800, si résolution inférieure à 1280 afficher mon site en 1024,....

J'ai plusieurs images qui apparaissent!

Il ne faudrait pas plutôt que je mette un code du type si résolution comprise entre 801 et 1023 afficher mon site en 800,....

J'ai donc cherché le code permettant de combiner ces plusieurs paramètres en javascript et je ne vois vraiment pas :

if (screen.width >800 ; <1024){
document.write("<a href='accueil.php'> <img src='PHP/Images/Intro/800/intro0.gif'></a>");

Il faut mettre quoi pour combiner ces deux conditions? un point virgule, un +, un &?
0
nEm3sis Messages postés 710 Date d'inscription lundi 20 août 2007 Statut Membre Dernière intervention 9 avril 2012 113
5 oct. 2008 à 02:30
si résolution inférieure à 1024 afficher mon site en 800, si résolution inférieure à 1280 afficher mon site en 1024,....
en fait je voulais dire
si résolution inférieure à 1024 afficher mon site en 800, sinon si résolution inférieure à 1280 afficher mon site en 1024,....

Il faut mettre quoi pour combiner ces deux conditions? l'opérateur && (et)
if((screen.width>=800)&&(screen.width<1024))


pour la bordure de l'image (qui est a cause du lien)
il te suffit de rajouter ça comme css
img{
border-style: hidden;
}
0
hellboy42 Messages postés 177 Date d'inscription mercredi 1 octobre 2008 Statut Membre Dernière intervention 25 octobre 2014 1
6 oct. 2008 à 12:58
Merci,

Le boder-style: hidden; fonctionne sous firefox mais pas sur internet explore... dommage... Il y a peut-être une autre solution??

A propos des résolutions j'ai tout refait comme il fait pour ceux n'ayant pas 800, 1024, 1280, 1440 et 1680 donc tu devrait avoir quelque chose dorénavant.

Seul souci, pour ces résolutions là, mes images ne sont du coup plus positionnez à la place exacte et font une taille non proportionnelle à la largeur d'écran du visiteur vu que je n'ai pa redimensionnez mes images pour toutes les résolutions existantes mais seulement les 5 cités au-dessus. Les % de left et de top que j'avais attribuez ne fonctionne donc pas pour les résolutions supérieures à 1680, inférieures à 800 ou entre 800 et 1024,...(ex: en 1152 mon site affiche mon site adapté en "800" du coup c'est mal aligné, disproportionnez,...)

Peut-être qu'une solution existe mais je ne vois pas à part redimensionner et sauvegarder mes images en toutes les résolutions possibles... mais quel travail...
0
nEm3sis Messages postés 710 Date d'inscription lundi 20 août 2007 Statut Membre Dernière intervention 9 avril 2012 113
9 oct. 2008 à 21:08
essaye le border-width a 0 pour voir
0
hellboy42 Messages postés 177 Date d'inscription mercredi 1 octobre 2008 Statut Membre Dernière intervention 25 octobre 2014 1
12 oct. 2008 à 18:33
ça marche que sur firefox avec le 0:(
0
hellboy42 Messages postés 177 Date d'inscription mercredi 1 octobre 2008 Statut Membre Dernière intervention 25 octobre 2014 1
14 oct. 2008 à 19:28
Quelqu'un aurait une autre solution svp?!
0
nEm3sis Messages postés 710 Date d'inscription lundi 20 août 2007 Statut Membre Dernière intervention 9 avril 2012 113
14 oct. 2008 à 22:04
ben écoute je sais pas trop mais je constate que j'ai pas de contour en mettant ça
<style>
img{
	border-width:0
}
</style>
<a href="http://www.commentcamarche.net/template/blocs/bloc_54/photo.jpg">
<img src="http://www.commentcamarche.net/template/blocs/bloc_54/photo.jpg">
</a>
que ce soit sous ie ou firefox


sinon ton site est bien sympa (à part toutes les pubs qui font fuir)
0
hellboy42 Messages postés 177 Date d'inscription mercredi 1 octobre 2008 Statut Membre Dernière intervention 25 octobre 2014 1
17 oct. 2008 à 12:16
Ok bah mon pc doit être fou alors ou j'ai un bug dans mon CSS que j'ai zappé. Je vais regarder de plus près.

Merci pour tout. En passant je commence le flash pour rendre mon site plus intéractif ( animation intro, menu déroulant, roll-over, son au survol de lien, preloader,...). Donc si tu as quelques notions ton aide est la bienvenue:

New post pour mon futur preloader : http://www.commentcamarche.net/forum/affich 8927552 preloader macromedia flash 8?#


@++
0
nEm3sis Messages postés 710 Date d'inscription lundi 20 août 2007 Statut Membre Dernière intervention 9 avril 2012 113
17 oct. 2008 à 20:34
je ne fais que html/php/javascript/css
avec une préférence pour le javascript

donc sans moi pour la suite
bon courage =)
0