Problème de Javascript avec certains navigateurs

M
medium69
WRInaute passionné
Je me sers d'un code pour déterminer la taille de la fenêtre de mes visiteur, afin de leur proposer un site adapté à cette dernière.

Voici la portion de code :
if (empty($_GET['wid']) ||
empty($_GET['hei']) ) { ?>
<script language="JavaScript" type="text/javascript">
<!--
xtref = document.referrer.replace(/[<>]/g, '').replace(/&/g, '$');
<?php
if (eregi("Gecko", $_SERVER['HTTP_USER_AGENT']) &&
!eregi("Netscape", $_SERVER['HTTP_USER_AGENT']) ) { ?>
hauteur = screen.height - 200;
<?php }
else { ?>
hauteur = (document.layers)?window.innerHeight:window.document.body.clientHeight;
<?php }
?>
largeur = (document.layers)?window.innerWidth:window.document.body.clientWidth;
window.location = '<?php echo $_SERVER['PHP_SELF'] ?>?wid='+ largeur +'&hei='+ hauteur +'&xtref='+ xtref;
//-->
</script>
<noscript>
<?php
$wid = 973; // largeur par défaut si Javascript désactivé
$hei = 548; // hauteur par défaut si Javascript désactivé
$javascript_desactive = 'IMPORTANT : Le Javascript est désactivé dans votre navigateur. '.NOM_SITE.' s\'affiche dans une résolution inadaptée pour votre fenêtre. Je vous conseille de l\'activer pour profiter pleinement du site.'; ?>
</noscript>
<?php }
Cliquez pour agrandir...

J'ai pêché les siganture que quelques navigateurs dont voici la liste de ceux que je connais et sur lesquels -www.science-et-vie.net à été testé :
:arrow: Internet Explorer
Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; SV1; .NET CLR 1.1.4322)
:arrow: Opéra
Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; en) Opera 8.0
:arrow: Maxthon :
Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; SV1; .NET CLR 1.1.4322)
:arrow: Smart Explorer :
Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; SV1; .NET CLR 1.1.4322)
:arrow: Netscape :
Mozilla/5.0 (Windows; U; Windows NT 5.1; fr-FR; rv:1.0.2) Gecko/20030208 Netscape/7.02
:arrow: Firefox :
Mozilla/5.0 (Windows; U; Windows NT 5.1; fr-FR; rv:1.7.5) Gecko/20041108 Firefox/1.0
:arrow: Mozilla :
Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.7.7) Gecko/20050414

J'ai remarqué que la commande
:arrow: hauteur = (document.layers)?window.innerHeight:window.document.body.clientHeight;
pose problème avec certains navigateurs ; je me sers donc d'un artifice :
:arrow: hauteur = screen.height - 200;

Le problème est qu'il ne détecte pas la largeur de la fenêtre, et donc mon script boucle.

Ceux concerné sont Firefox et Mozilla.
Leur point commun pourrait être le gecko mais Netscape n'est pas touché...
si le rv:1.7.7 par exemple pour Mozilla et le numéro de révision, il se pourrait que le problème survienne à partir de la révision 1.7.

Est-ce que quelqu'un à une idée à ce sujet ?

Et est-ce que quelqu'un peut m'indiquer des signatures d'autres navigateurs avec lesquel mon site bouclerais ?
 
C
cedfr
WRInaute passionné
Bonjour,
Bumper votre sujet ne sert à rien et si une personne arrive à vous aider et trouve une solution, elle le fera avec grand plaisir.

:wink:
 
H
hicouri
Nouveau WRInaute
Salut l'ami !

J'ai eu le même badtrip que toi et après des heures de galère et de recherche j'ai trouvé l'aiguille dans la botte de foin (c'est d'ailleurs en cherchant comme un ouf que je suis tomber sur ton message).

Le site est pas mal alors pour récompenser son auteur je mets le lien et puis comme ça tu trouveras peut etre des trucs intéressant...

en espérant t'as aidé
Bonne prog' !

HICOURI FOUX
 
H
hicouri
Nouveau WRInaute
par contre il m'arrive un truc bizarre !!

chez moi c'est IE qui veut pas !!

innerWidth marche très bien sous Mozilla mais clientWidth ne fonctionne pas avec IE !!

Comprends pas...

Parcontre il me semble que dans ton cas c'est ton test qui foire, je m'explique : je crois que "document.layers?" n'est valable que pour des vieilles versions de Netscape. Teste plutôt document.getElementById... En fait le mieux c'est carrément de tester la propiété que tu veux utiliser (par exemple, dans notre cas, moi je teste "window.innerHeight" et ça marche sous Firefox).

Donc voilà si t'as des conseils à me donner concernant IE c'est pas de refus !

@+
 
H
hicouri
Nouveau WRInaute
Bon je sais : je suis relou, je marque un nouveau message toutes les 5 minutes mais je m'excuse d'être étourdi et j'espère que les modos ne vont pas trop criser !! ;)

Finalement tout va bien j'ai réussi à faire fonctionner clientWidth...
J'l'avais juste mis à un mauvais endroit (je ne connais pas la cause réelle mais je pense que ça ne marchais pas car la propriété ne devait pas être initialisée ??? qui sait...).
Voilà c'est tout

merci

Tchao
 
M
medium69
WRInaute passionné
hicouri a dit:
par contre il m'arrive un truc bizarre !!

chez moi c'est IE qui veut pas !!

innerWidth marche très bien sous Mozilla mais clientWidth ne fonctionne pas avec IE !!

Comprends pas...

Parcontre il me semble que dans ton cas c'est ton test qui foire, je m'explique : je crois que "document.layers?" n'est valable que pour des vieilles versions de Netscape. Teste plutôt document.getElementById... En fait le mieux c'est carrément de tester la propiété que tu veux utiliser (par exemple, dans notre cas, moi je teste "window.innerHeight" et ça marche sous Firefox).

Donc voilà si t'as des conseils à me donner concernant IE c'est pas de refus !

@+
Cliquez pour agrandir...
Obligé" de partir en courant, mais je m'attache au problème en rentrant...

IE ne me pose pas de problème à moi.

Quelle version as-tu ?
 
H
hicouri
Nouveau WRInaute
J'ai IE 6 mais en fait le problème venait du fait que j'appelait ma fonction trop tôt (avant le body... oui je sais c'est con mais c'était pour initialiser des variables globales à l'inclusion d'un fichier).

Ensuite j'ai parcontre rencontrer un autre probleme mais pour la hauteur cette fois ci : en effet clientHeight restait fixe pour n'importe quelle taille de fenêtre.
J'en ai déduit que comme on demandait la taille du BODY, IE devait s'arrêter à la hauteur de la dernière ligne de code ajoutée (je sais pas si je m'exprime bien mais tu vas comprendre...).
Ma solution a été de mettre style="height:100%;" dans la balise BODY, du coup la hauteur du corps de la page correspond exactement à celle de la fenêtre cependant si le contenu est plus grand que l'écran ça ne fonctionne pas car il s'arrête tojours à la dernière ligne de code...

En fait je cherche à obtenir les coordonnées du milieu de la fenêtre. J'utilise window.inner... pour les navigateurs compatibles Netscape, document.body.client... pour les navig compatibles IE et je mets malheureuse des coordonnées par défault pour tout les autres...
Sous Firefox inner... marche parfaitement mais sous IE client... me renvoie la taille du body et non pas de la fenêtre... :(

Voilà.. :) @+
 
H
hicouri
Nouveau WRInaute
j'crois que j'commence à saisir : on dirait que ça dépend de l'endroit d'où est appelée la fonction...
 
H
hicouri
Nouveau WRInaute
ça y est !

utilisé tout de suite après la balise BODY, document.body.clientHeight me donne effectivement la taille de la fenêtre, à condition que l'attribut style="height: XXX %" soit renseigné. J'ai mis xxx car j'ai du me résoudre à mettre 90% au lieu de 100% : je ne sais pour quelle raison 100% fait apparaitre la srcoll bar verticale même s'il n'y en a pas besoin avec une marge en bas de la page... bizarre

sinon utilisé dans le code du body je crois que la même propriété renvoie la hauteur du body à l'endroit où elle a été appelée
 
M
medium69
WRInaute passionné
Je remet le script actuel de mon site, car les modifications que j'essaye d'y apporter ne conviennent pas...

Help :!:

/* On a pas les dimensions de la fenêtre */
// on détermine les dimensions par le Javascript ou on donne des valeurs par défaut si le Javascript est désactivé
if (empty($_GET['wid']) ||
empty($_GET['hei']) ) { ?>
<script language="JavaScript" type="text/javascript">
<!--
var xtref = document.referrer.replace(/[<>]/g, '').replace(/&/g, '$');
<?php
if (eregi("Gecko", $_SERVER['HTTP_USER_AGENT']) && !eregi("Netscape", $_SERVER['HTTP_USER_AGENT']) ) { ?>
var hauteur = screen.availHeight - 200;
var largeur = screen.availWidth;
<?php }
else { ?>
var hauteur = (document.layers)?window.innerHeight:window.document.body.clientHeight;
var largeur = (document.layers)?window.innerWidth:window.document.body.clientWidth;

<?php }
?> window.location = '<?php echo $_SERVER['PHP_SELF'] ?>?wid='+ largeur +'&hei='+ hauteur +'&xtref='+ xtref;
//-->
</script>
<noscript>
<?php
$largeur = 973; // largeur par défaut si Javascript désactivé
$hauteur = 548; // hauteur par défaut si Javascript désactivé
$javascript_desactive = 'IMPORTANT : Le Javascript est désactivé dans votre navigateur. '.NOM_SITE.' s\'affiche dans une résolution inadaptée pour votre fenêtre. Je vous conseille de l\'activer pour profiter pleinement du site.'; ?>
</noscript>
<?php }

/* On a la taille de la fenêtre */
Suite du code...
Cliquez pour agrandir...
 
H
hicouri
Nouveau WRInaute
Mais au fait tu veux la taille de l'écran ou de la fenêtre ? Parsque screen.availWidth etc... c'est pour l'écran seulement, mais tu dois déjà le savoir.

BREF,

essaye plutôt un truc comme ça (en javascript biensur) :

// valeurs par défaut
var largeur = 200;
var hauteur = 200;

// ensuite on ne les modifie que lorsque le navigateur connait les bonnes propriétés
if(window.innerHeight) {largeur=window.innerWidth; hauteur =window.innerHeight;}
else if(document.body.clientWidth) {largeur=document.body.clientWidth; hauteur =document.body.clientHeight;}

bon courage mais surtout BONNE CHANCE (pasqu'il en faut avec le javascript)
 
M
medium69
WRInaute passionné
C'est la taille de la fenêtre qui m'intéresse.

A défaut je prend la résolution, et j'enlève une valeur par défaut pour que le site soit adapté au navigateur.

Pour finir, des valeurs sont attribuée par défaut si le Java est désactivé.

De toute manière, avec cette config, je touche un max de monde ; donc je ne vais pas aller me prendre la tête plus que ça.

Surtout que j'ai même été poussé le vice à tenir compte du système d'exploitation !
 
M
medium69
WRInaute passionné
Comme promis, j'ai testé... et...

Ô merveille !!

Plus de prise de tête.

Merci à toi, et mes excuses pour t'avoir zappé
 
Vous devez vous connecter ou vous inscrire pour répondre ici.
1.fr
Discussions similaires
O
Petit problème javascript
Réponses
19
Affichages
2K
ortolojf
O
E
Problème d'affichage de contenu lorsque JavaScript est désactivé - Besoin d'aide SEO
Réponses
1
Affichages
2K
emualliug
E
P
Problème de conflit javascript
Réponses
6
Affichages
3K
poupilou
P
sigma2008
Petit problème dans le javascript
Réponses
2
Affichages
2K
sigma2008
sigma2008
O
Problème compression de script Javascript
Réponses
5
Affichages
2K
ortolojf
O
Y
Problème & et &amp; sur lien javascript
Réponses
10
Affichages
3K
Yanig
Y
F
Problème avec javascript et referencement
Réponses
4
Affichages
1K
Altenide
A
M
Un problème au niveau changer les prix en javascript
Réponses
7
Affichages
2K
Leonick
L
A
Problème javascript Prototype et Scriptaculous
Réponses
2
Affichages
3K
adripop
A
UsagiYojimbo
Problème Javascript IE/Firefox : InnerHTML
Réponses
4
Affichages
6K
UsagiYojimbo
UsagiYojimbo
S
Problème de javascript
Réponses
2
Affichages
2K
sff
S
C
Problème d'accent avec un javascript
Réponses
1
Affichages
7K
yanhl
Y
T
Problème de date en javascript
Réponses
4
Affichages
3K
Th0r
T
Q
JavaScript. Problème de doucment.write()
Réponses
5
Affichages
2K
qnguyen
Q
A
Problème avec document.write en javascript
Réponses
5
Affichages
5K
lesbonsplansdesophie
L
P
Editeur de texte javascript : Problème doctype
Réponses
4
Affichages
4K
psychoreflex
P
S
Problème Javascript. c'est tout con mais
Réponses
4
Affichages
2K
sultan
S
Gougueule
Avez vous un problème d'accès au webmail OVH?
Réponses
8
Affichages
194
Gougueule
Gougueule
R
Problème d'indexation des pages produits malgré des demandes manuelles via la Search Console
Réponses
2
Affichages
710
cthierry
cthierry
T
Problème score INP uniquement sur mobiles
Réponses
1
Affichages
742
eldk
E
Haut