Traiter en HTML le r�sultat d'une fonction javascript

**sarrasin.drums** · 08/05/2008, 08h56

Bonjour,

Le code contient une fonction hyper simple qui permet de d�tecter la r�solution d'�cran du visiteur, et de l'afficher.

Maintenant, je souhaite r�cup�rer les valeurs retourn�es, et les afficher, mais cette fois, dans la page HTML...

Comment dois-je proc�der ?
Quelqu'un peut-il me guider ?

Merci d'avance.

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
 
<HEAD>
 
<!--********************************* Fonction(s) Javascript ************************************
-->
 
<SCRIPT LANGUAGE="Javascript" type="text/javascript">
 
function resolution_ecran () 
 
  {
     width = screen.width; 
     height = screen.height;
     document.write("Votre résolution (javascript) est : " + width + "*" + height);
     return width;
     return height;
  }
 
</SCRIPT>
 
<!--********************************************************************************************
                           TITLE DIVISION (Titre du document)
************************************************************************************************
-->
 
<title>
</title>
 
</HEAD>
 
<!--*********************************************************************************************
                           BODY DIVISION (Corps du document)
*************************************************************************************************
-->
 
<BODY onLoad="resolution_ecran ()">
 
<BR><BR>
 
Votre résolution (html) est : 
 
<!--*********************************************************************************************
	                         FIN DU DOCUMENT
*************************************************************************************************
-->
 
</BODY>
</HTML>

**julien.63** · 08/05/2008, 13h50

salut,
tout d'abord, quelques commentaires concernant ta page.
Tu ne peux pas avoir deux return dans une m�me fonction. Car la fonction s'arr�te sur le premier et le second ne sera jamais ex�cut�.

ensuite, il n'y a pas de r�solution html et de r�solution javascript. Il y a une r�solution d'�cran.

J'ai modifi� un peu ta page. Tu verras dans la fonction javascript, je r�cup�re l'element de la page html (getElementById) o� je souhaite afficher ma valeur (innerHTML).

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
<html>
<HEAD>
 
<!--********************************* Fonction(s) Javascript ************************************
-->
 
<SCRIPT LANGUAGE="Javascript" type="text/javascript">
 
function resolution_ecran () 
 
  {
     width = screen.width; 
     height = screen.height;
     document.getElementById('resolution').innerHTML = "Votre résolution (javascript) est : " + width + "*" + height;
  }
 
</SCRIPT>
 
<!--********************************************************************************************
                           TITLE DIVISION (Titre du document)
************************************************************************************************
-->
 
<title>
</title>
 
</HEAD>
 
<!--*********************************************************************************************
                           BODY DIVISION (Corps du document)
*************************************************************************************************
-->
 
<BODY onLoad="resolution_ecran ()">
 
<BR><BR>
<span id="resolution"></span>
 
<!--*********************************************************************************************
	                         FIN DU DOCUMENT
*************************************************************************************************
-->
 
</BODY>
</HTML>

**sarrasin.drums** · 08/05/2008, 18h45

Merci de tes �claircissements, julien.63.

Effectivement, je ne connaissais pas la balise <span>, et apr�s avoir test� ton code, j'ai cherch�, mais il s'av�re que cela concerne du CSS, or pour moi, ce n'est pas mon but...

Quelques explications :

Je cherche � faire une page concernant ma toute petite commune, simple, avec quelques afichages de photos genre �glise, mairie, etc..
Et en fonction de la r�solution du visiteur, je pourrais redimensionner les images en cons�quence.

Comme je sais qu'il n'y a qu'une seule r�solution, ce que je voulais dire, c'est que dans la partie javascript, une phrase s'affiche (comme �a, je sais qu'elle vient de la fonction), et dans la partie html, donc dans le <body>, la m�me phrase s'affiche, mais avec les valeurs retourn�es...

Comme tu m'as pr�cis� qu'il n'y aura qu'un seul retour possible, comment faire alors ?

**Sacha999** · 09/05/2008, 00h55

rien ne t'empeche de faire un

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

return [width,height];

apres tu r�cupere comme ca

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
 
var laResolution = resolution_ecran();
var laLargeur = laResolution[0];
var laHauteur = laResolution[1];

Mais bon j'ai pas trop compris ce que tu essaie de faire

**sarrasin.drums** · 09/05/2008, 11h42

Mais bon j'ai pas trop compris ce que tu essaie de faire

En fait, je disais ceci :

Je cherche � faire une page concernant ma toute petite commune, simple, avec quelques afichages de photos genre �glise, mairie, etc..
Et en fonction de la r�solution du visiteur, je pourrais redimensionner les images en cons�quence.

Mais dans le code que tu me montres en exemple, sacha999, c'est la 2�me partie que je comprends plus :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
var laResolution = resolution_ecran();
var laLargeur = laResolution[0];
var laHauteur = laResolution[1];

En effet, ce code ne doit-il pas �tre mis � l'int�rieur de la fonction de d�tection de la r�solution d'�cran ?
Moi, je souhaite r�cup�rer ces deux valeurs (hauteur et largeur), pour ensuite m'en servir comme param�tres de dimensionnement d'une applet...Donc apr�s l'appel de la fonction javascript.
Mais on dirait que la page html reste bloqu�e � l'int�rieur de cette fonction, car si j'essaie d'afficher une phrase en dehors, rien ne se passe...

Je ne sais si je suis clair, mais en tous cas, merci � tous pour une aide qui me ferait le plus grand bien...

**Auteur** · 09/05/2008, 12h49

bonjour,

pourquoi tu n'utilises pas le % pour les dimensions de tes composants ?

De plus conna�tre la r�solution de l'�cran ne pourra sans doute pas te servir � grand chose : les valeurs retourn�es seront toujours les m�mes que la fen�tre du navigateur soit en plein �cran ou non. Or tu devrais fixer les dimensions des composants en fonction de la taille de la fen�tre du navigateur et non en fonction de la r�solution de l'�cran.

**sarrasin.drums** · 09/05/2008, 13h05

Bonjour � toi Auteur,

J'ai peur d'avoir manqu� un wagon... peux-tu, s'il te pla�t, m'expliquer plus clairement ce que tu viens d'�crire :

pourquoi tu n'utilises pas le % pour les dimensions de tes composants ?

Mais avant cela, je viens de m'apercevoir de quelque chose : je reste bloqu� sur l'ex�cution de la fonction.
En effet, quand j'enl�ve le "onLOAD", tout ce que je veux faire afficher appara�t (sauf bien-s�r les valeurs � retourner puisque je n'appelle plus la fonction)...
Bizarre

Il me semble qu'en th�orie l'ex�cution du code est lin�aire, non ? Donc juste apr�s l'ex�cution de la fonction (qui se passe bien), on est cens� revenir � l'instruction qui suit l'appel...

Ou alors, je suis vraiment trop nul

**Auteur** · 10/05/2008, 13h22

Envoy� par sarrasin.drums

Bonjour � toi Auteur,

J'ai peur d'avoir manqu� un wagon... peux-tu, s'il te pla�t, m'expliquer plus clairement ce que tu viens d'�crire :

pourquoi tu n'utilises pas le % pour les dimensions de tes composants ?

tu as �crit plus haut :

Je cherche � faire une page concernant ma toute petite commune, simple, avec quelques afichages de photos genre �glise, mairie, etc..
Et en fonction de la r�solution du visiteur, je pourrais redimensionner les images en cons�quence.

tu n'es pas oblig� d'utiliser le pixel (px) pour dimensionner tes composants. tu peux utiliser une �chelle relative. Je te propose donc de prendre le pourcent (%).
Par exemple si tu as :

Code html :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
 
<div style="width:50%; border: 1px solid #000000">
coucou
</div>

ce div aura toujours une largeur de 50% de la largeur totale de ta fen�tre quelle que soit la r�solution.

-----------------------------------------------------------------

Mais avant cela, je viens de m'apercevoir de quelque chose : je reste bloqu� sur l'ex�cution de la fonction.
En effet, quand j'enl�ve le "onLOAD", tout ce que je veux faire afficher appara�t (sauf bien-s�r les valeurs � retourner puisque je n'appelle plus la fonction)...
Bizarre

Il me semble qu'en th�orie l'ex�cution du code est lin�aire, non ? Donc juste apr�s l'ex�cution de la fonction (qui se passe bien), on est cens� revenir � l'instruction qui suit l'appel...

non l'ex�cution d'un code JS n'est pas lin�raire dans le cas o� tu �cris ton code dans une fonction ce qui est le cas ici. Pour que ton code s'ex�cute plusieurs possibilit�s :

la fonction est appel�e par une autre fonction ;
la fonction est appel�e lors d'un �v�nement (ici onload) ;

l'appel de la fonction se fait gr�ce � des balises scripts plac�es dans le code HTML (et dans ce cas l'ex�cution est lin�aire) :

Code html :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
 
<html>
<head>
 
<title></title>
 
<script type="text/javascript">
<!--
function afficheCoucou()
{
  alert("coucou");
}
//-->
</script>
 
</head>
 
<body>
 
<script type="text/javascript">
afficheCoucou(); 
</script>
 
</body>
 
</html>

l'appel de la fonction se fait apr�s sa d�claration (et dans ce cas l'ex�cution est lin�aire �galement) :

Code html :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
 
<html>
<head>
 
<title></title>
 
<script type="text/javascript">
<!--
function afficheCoucou()
{
  alert("coucou");
}
 
afficheCoucou(); 
 
//-->
</script>
 
</head>
 
<body>
 
 
</body>
 
</html>

Dans les deux derniers cas, m�me si le r�sultat est le m�me, le code n'est pas ex�cut� au m�me moment.

Traiter en HTML le r�sultat d'une fonction javascript

JavaScript

Discussions similaires

Partager

Partager