Javascript Internet Explorer et opéra [Résolu]

hellboy42 54Messages postés 1 octobre 2008Date d'inscription - Dernière réponse le 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.

Javascript Internet Explorer et opéra »

Suggestions

Javascript Internet Explorer et opéra
Activer javascript internet explorer (Résolu) » Forum
[javascript] et Internet explorer (Résolu) » Forum
Autoriser javascript sous "internet explorer& (Résolu) » Forum
Activation "Javascript" dans IE6 » Forum
Javascript - Manipulation des contrôles clavier » Fiches pratiques

Plus

Réponse

nEm3sis 703Messages postés 20 août 2007Date d'inscription 9 avril 2012Dernière intervention 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)

Ajouter un commentaire

Réponse

hellboy42 54Messages postés 1 octobre 2008Date d'inscription 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?

Ajouter un commentaire - Site web

Réponse

nEm3sis 703Messages postés 20 août 2007Date d'inscription 9 avril 2012Dernière intervention 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 ?

Ajouter un commentaire

Réponse

hellboy42 54Messages postés 1 octobre 2008Date d'inscription 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.

Ajouter un commentaire - Site web

Réponse

hellboy42 54Messages postés 1 octobre 2008Date d'inscription 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 &?

Ajouter un commentaire - Site web

Réponse

nEm3sis 703Messages postés 20 août 2007Date d'inscription 9 avril 2012Dernière intervention 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;
}

Ajouter un commentaire

Réponse

hellboy42 54Messages postés 1 octobre 2008Date d'inscription 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...

Ajouter un commentaire - Site web

Réponse

nEm3sis 703Messages postés 20 août 2007Date d'inscription 9 avril 2012Dernière intervention 9 oct. 2008 à 21:08

essaye le border-width a 0 pour voir

Ajouter un commentaire

Réponse

hellboy42 54Messages postés 1 octobre 2008Date d'inscription 12 oct. 2008 à 18:33

ça marche que sur firefox avec le 0:(

Ajouter un commentaire - Site web

Réponse

hellboy42 54Messages postés 1 octobre 2008Date d'inscription 14 oct. 2008 à 19:28

Quelqu'un aurait une autre solution svp?!

Ajouter un commentaire - Site web

Réponse

nEm3sis 703Messages postés 20 août 2007Date d'inscription 9 avril 2012Dernière intervention 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)

Ajouter un commentaire

Réponse

hellboy42 54Messages postés 1 octobre 2008Date d'inscription 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?#

@++

Ajouter un commentaire - Site web

Réponse

nEm3sis 703Messages postés 20 août 2007Date d'inscription 9 avril 2012Dernière intervention 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 =)

Ajouter un commentaire

Répondre au sujet

Posez votre question

Dossier à la une

Passage au tout numérique : quel coût pour les particuliers ?

Passage au tout numérique : quel coût pour les particuliers ?

Combien cela coûte-t-il au total ? Quelles aides apportent l'état et les acteurs du marché pour alléger cette charge non choisie ? Tous les détails sur Commentçamarche.net.

Javascript Internet Explorer et opéra [Résolu]

Javascript Internet Explorer et opéra »

Passage au tout numérique : quel coût pour les particuliers ?