Arriere plan = fct(résolution écran)
Résolu
cs_Fab117
Messages postés
23
Date d'inscription
lundi 11 août 2003
Statut
Membre
Dernière intervention
9 janvier 2008
-
28 juin 2005 à 15:52
ptilud2g Messages postés 1 Date d'inscription dimanche 19 juillet 2009 Statut Membre Dernière intervention 12 août 2009 - 12 août 2009 à 11:31
ptilud2g Messages postés 1 Date d'inscription dimanche 19 juillet 2009 Statut Membre Dernière intervention 12 août 2009 - 12 août 2009 à 11:31
A voir également:
- Arriere plan = fct(résolution écran)
- Grp - groupe de résolution de problèmes - Forum Delphi / Pascal
- Fond ecran simple - Forum Visual Basic
- Plan de chargement conteneur excel ✓ - Forum Visual Basic 6
- Plan de test exemple excel ✓ - Forum Visual Basic 6
- Algorithme chargement de camion - Forum Java
11 réponses
cs_Fab117
Messages postés
23
Date d'inscription
lundi 11 août 2003
Statut
Membre
Dernière intervention
9 janvier 2008
6 juil. 2005 à 18:20
6 juil. 2005 à 18:20
Salut,
Comme d'habitude, ça fonctionne.
Merci
Fab
Comme d'habitude, ça fonctionne.
Merci
Fab
the_smurf
Messages postés
283
Date d'inscription
vendredi 6 août 2004
Statut
Membre
Dernière intervention
22 juin 2006
28 juin 2005 à 16:14
28 juin 2005 à 16:14
Pour détecter la résolution de l'écran tu as les attributs js:
screen.width et screen.height
Tu peux même detecter la surface utile de l'écran (sans la barre de navigation,...)
screen.availWidth et screen.availHeight.
En fonction de ces résultats tu peux utiliser une image d'arrière plan adaptée.
Quand la résolution de l'écran est plus grande que celle de l'image, cette dernière va être répéter... Tu peux l'empêcher en utilisant background-repeat:no-repeat.
Si la résolution de l'écran est plus petite que celle de l'image, cette dernière va être rognée.
The SMURF
[mailto:the_little_smurf@yahoo.fr the_little_smurf@yahoo.fr]
Enjoy the life, don't waste your time in front of your computer
screen.width et screen.height
Tu peux même detecter la surface utile de l'écran (sans la barre de navigation,...)
screen.availWidth et screen.availHeight.
En fonction de ces résultats tu peux utiliser une image d'arrière plan adaptée.
Quand la résolution de l'écran est plus grande que celle de l'image, cette dernière va être répéter... Tu peux l'empêcher en utilisant background-repeat:no-repeat.
Si la résolution de l'écran est plus petite que celle de l'image, cette dernière va être rognée.
The SMURF
[mailto:the_little_smurf@yahoo.fr the_little_smurf@yahoo.fr]
Enjoy the life, don't waste your time in front of your computer
cs_Fab117
Messages postés
23
Date d'inscription
lundi 11 août 2003
Statut
Membre
Dernière intervention
9 janvier 2008
28 juin 2005 à 16:39
28 juin 2005 à 16:39
Salut,
Merci pour tes conseils, mais étant débutant, c'est un peu flou.
J'ai trouvé un script qui détecte la résolution de l'écran (rt dans cet exemple l'affiche), mais sur cette base, comment puis-je le réorienter en fonction du résultat de la variable "Ecran"
Entre <HEAD> et </HEAD>
<SCRIPT LANGUAGE= "JavaScript">
EcranHaut = screen.height;
EcranLarg = screen.width;
Ecran = EcranLarg + " x " + EcranHaut;
</SCRIPT>
Entre et :
<SCRIPT LANGUAGE ="JavaScript">
document.write(Ecran);
</SCRIPT>
Est-il possible de faire quelque chose du genre :
If EcranLarg = 800 then background="arriere-plan 800 x 600.jpg"
Merci pour tes conseils, mais étant débutant, c'est un peu flou.
J'ai trouvé un script qui détecte la résolution de l'écran (rt dans cet exemple l'affiche), mais sur cette base, comment puis-je le réorienter en fonction du résultat de la variable "Ecran"
Entre <HEAD> et </HEAD>
<SCRIPT LANGUAGE= "JavaScript">
EcranHaut = screen.height;
EcranLarg = screen.width;
Ecran = EcranLarg + " x " + EcranHaut;
</SCRIPT>
Entre et :
<SCRIPT LANGUAGE ="JavaScript">
document.write(Ecran);
</SCRIPT>
Est-il possible de faire quelque chose du genre :
If EcranLarg = 800 then background="arriere-plan 800 x 600.jpg"
the_smurf
Messages postés
283
Date d'inscription
vendredi 6 août 2004
Statut
Membre
Dernière intervention
22 juin 2006
28 juin 2005 à 16:59
28 juin 2005 à 16:59
C'est exactement cela...
Ex:
<html>
<head>
<script>
function loadBackground(){
hauteur = screen.height;
largeur = screen.width;
var myBackgroundImage = "backgroundDefault.jpg"
if(hauteur==600 && largeur==800){
myBackgroundImage = "background800x600.jpg"
}
if(hauteur==768 && largeur==1024){
alert("test");
myBackgroundImage = "background1024x768.jpg"
}
window.document.getElementsByTagName("body")[0].style.backgroundImage = "url("+myBackgroundImage+")";
}
</script>
</head>
test
<script>
loadBackground();
</script>
</html>
The SMURF
[mailto:the_little_smurf@yahoo.fr the_little_smurf@yahoo.fr]
Enjoy the life, don't waste your time in front of your computer
Ex:
<html>
<head>
<script>
function loadBackground(){
hauteur = screen.height;
largeur = screen.width;
var myBackgroundImage = "backgroundDefault.jpg"
if(hauteur==600 && largeur==800){
myBackgroundImage = "background800x600.jpg"
}
if(hauteur==768 && largeur==1024){
alert("test");
myBackgroundImage = "background1024x768.jpg"
}
window.document.getElementsByTagName("body")[0].style.backgroundImage = "url("+myBackgroundImage+")";
}
</script>
</head>
test
<script>
loadBackground();
</script>
</html>
The SMURF
[mailto:the_little_smurf@yahoo.fr the_little_smurf@yahoo.fr]
Enjoy the life, don't waste your time in front of your computer
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
cs_Fab117
Messages postés
23
Date d'inscription
lundi 11 août 2003
Statut
Membre
Dernière intervention
9 janvier 2008
1 juil. 2005 à 15:33
1 juil. 2005 à 15:33
Resalut The_smurf,
Encore un point s'il te plait.
J'ai essayé ton script et il fonctionne parfaitement si la résolution de l'écran de l'internaute est de 800 x 600 ou de 1024 x 768. Mais dans les autres cas, il ne charge pas l'arrière plan.
J'ai donc essayé de le modifier en lui disant que si la variable hauteur était plus petite que 650 il devait choisir la petite image et que dans le cas contraire il devait choisir la grande. Mais ça ne marche pas, il choisit toujours la grande image.
De plus, pourrais-tu me dire à quoi sert la ligne "window.document.getElementsByTagName("body")[0].style.backgroundImage = "url("+myBackgroundImage+")";"
Voici ma version de ton script :
<html>
<head>
<script>
function loadBackground(){
hauteur = screen.height;
largeur = screen.width;
var myBackgroundImage = "backgroundDefault.jpg"
if(hauteur>>650){
myBackgroundImage = "background800x600.jpg"
}
if(hauteur<<650){
myBackgroundImage = "background1024x768.jpg"
}
window.document.getElementsByTagName("body")[0].style.backgroundImage = "url("+myBackgroundImage+")";
}
</script>
</head>
test
<script>
loadBackground();
</script>
</html>
Merci d'avance
Encore un point s'il te plait.
J'ai essayé ton script et il fonctionne parfaitement si la résolution de l'écran de l'internaute est de 800 x 600 ou de 1024 x 768. Mais dans les autres cas, il ne charge pas l'arrière plan.
J'ai donc essayé de le modifier en lui disant que si la variable hauteur était plus petite que 650 il devait choisir la petite image et que dans le cas contraire il devait choisir la grande. Mais ça ne marche pas, il choisit toujours la grande image.
De plus, pourrais-tu me dire à quoi sert la ligne "window.document.getElementsByTagName("body")[0].style.backgroundImage = "url("+myBackgroundImage+")";"
Voici ma version de ton script :
<html>
<head>
<script>
function loadBackground(){
hauteur = screen.height;
largeur = screen.width;
var myBackgroundImage = "backgroundDefault.jpg"
if(hauteur>>650){
myBackgroundImage = "background800x600.jpg"
}
if(hauteur<<650){
myBackgroundImage = "background1024x768.jpg"
}
window.document.getElementsByTagName("body")[0].style.backgroundImage = "url("+myBackgroundImage+")";
}
</script>
</head>
test
<script>
loadBackground();
</script>
</html>
Merci d'avance
the_smurf
Messages postés
283
Date d'inscription
vendredi 6 août 2004
Statut
Membre
Dernière intervention
22 juin 2006
1 juil. 2005 à 15:58
1 juil. 2005 à 15:58
1/ Oui le script que je t'ai écrit permettait uniquement de charger tel ou tel fond d'écran pour une résolution d'exactement 800x600 ou 1024x768.
Ce sont les tests des if.
C'est à toi d'adapter le script pour qu'il fasse exactement ce que tu désires.
2/ Comme tu l'as compris, pour choisir entre 2 images pour toutes les résolutions, il suffit de changer les conditions des if et utiliser > ou <.
Attention en javascript un seul > ou < et non 2 >> << comme je voie.
C'est la seule erreur de ton script...
3/ A quoi sert window.document.getElementsByTagName("body")[0].style.backgroundImage = "url("+myBackgroundImage+")";
Normalement pour mettre un background dans une page, dans le body on écrit:
Dans notre cas on ne sait a priori pas quelle image on veut mettre en fond donc on crée un body "tout nu"
Puis à la fin de la création de la page on appelle une fonction: loadBackground(); que l'on a écrit et qui:
-1- détecte la définition de l'écran
-2- choisi l'image à mettre en fond d'écran et stocke son url dans une variable
-3- qui met cette image en fond d'écran, et c'est la la fonction de la ligne en question
Comment ça marche. En français cette ligne pourrait signifier
Prend la fenêtre courante (window), prend son contenu (document), cherche y le premier ([0]) tag nommé body (getElementsByTagName("body")), prend son attribut style (style), et prend son attribut backgroundImage...
De cette manière on accède au background-image que l'on aurait pu écrire sans script... puis on lui donne la valeur contenant l'url de notre image de fond d'écran.
The SMURF
[mailto:the_little_smurf@yahoo.fr the_little_smurf@yahoo.fr]
Enjoy the life, don't waste your time in front of your computer
Ce sont les tests des if.
C'est à toi d'adapter le script pour qu'il fasse exactement ce que tu désires.
2/ Comme tu l'as compris, pour choisir entre 2 images pour toutes les résolutions, il suffit de changer les conditions des if et utiliser > ou <.
Attention en javascript un seul > ou < et non 2 >> << comme je voie.
C'est la seule erreur de ton script...
3/ A quoi sert window.document.getElementsByTagName("body")[0].style.backgroundImage = "url("+myBackgroundImage+")";
Normalement pour mettre un background dans une page, dans le body on écrit:
Dans notre cas on ne sait a priori pas quelle image on veut mettre en fond donc on crée un body "tout nu"
Puis à la fin de la création de la page on appelle une fonction: loadBackground(); que l'on a écrit et qui:
-1- détecte la définition de l'écran
-2- choisi l'image à mettre en fond d'écran et stocke son url dans une variable
-3- qui met cette image en fond d'écran, et c'est la la fonction de la ligne en question
Comment ça marche. En français cette ligne pourrait signifier
Prend la fenêtre courante (window), prend son contenu (document), cherche y le premier ([0]) tag nommé body (getElementsByTagName("body")), prend son attribut style (style), et prend son attribut backgroundImage...
De cette manière on accède au background-image que l'on aurait pu écrire sans script... puis on lui donne la valeur contenant l'url de notre image de fond d'écran.
The SMURF
[mailto:the_little_smurf@yahoo.fr the_little_smurf@yahoo.fr]
Enjoy the life, don't waste your time in front of your computer
cs_Fab117
Messages postés
23
Date d'inscription
lundi 11 août 2003
Statut
Membre
Dernière intervention
9 janvier 2008
2 juil. 2005 à 09:11
2 juil. 2005 à 09:11
Super, ça marche parfaitement.
Merci (aussi pour toutes les explications) et bon week-end.
Fab
Merci (aussi pour toutes les explications) et bon week-end.
Fab
cs_Fab117
Messages postés
23
Date d'inscription
lundi 11 août 2003
Statut
Membre
Dernière intervention
9 janvier 2008
5 juil. 2005 à 15:35
5 juil. 2005 à 15:35
Salut The_smurf,
J'aurais encore une question à propos de ce script.
Avec Firefox, pas de problème, mais avec IE (XP service Pack 2), si je ne valide pas le message d'avertissement, il ne charge aucun fond.
Y-a-t-il possibilité de rajouter une ligne de code pour qu'il charge de toute façon une image par défaut ?
Voici le script :
<head>
<script>
function loadBackground(){
hauteur = screen.height;
largeur = screen.width;
var myBackgroundImage = "background1024x768.jpg"
if(hauteur<650){
myBackgroundImage = "background800x600.jpg"
}
if(hauteur>650){
myBackgroundImage = "background1024x768.jpg"
}
window.document.getElementsByTagName("body")[0].style.backgroundImage = "url("+myBackgroundImage+")";
}
</script>
</head>
<script>
loadBackground();
</script>
</html>
Merci d'avance.
Fab
J'aurais encore une question à propos de ce script.
Avec Firefox, pas de problème, mais avec IE (XP service Pack 2), si je ne valide pas le message d'avertissement, il ne charge aucun fond.
Y-a-t-il possibilité de rajouter une ligne de code pour qu'il charge de toute façon une image par défaut ?
Voici le script :
<head>
<script>
function loadBackground(){
hauteur = screen.height;
largeur = screen.width;
var myBackgroundImage = "background1024x768.jpg"
if(hauteur<650){
myBackgroundImage = "background800x600.jpg"
}
if(hauteur>650){
myBackgroundImage = "background1024x768.jpg"
}
window.document.getElementsByTagName("body")[0].style.backgroundImage = "url("+myBackgroundImage+")";
}
</script>
</head>
<script>
loadBackground();
</script>
</html>
Merci d'avance.
Fab
the_smurf
Messages postés
283
Date d'inscription
vendredi 6 août 2004
Statut
Membre
Dernière intervention
22 juin 2006
6 juil. 2005 à 09:26
6 juil. 2005 à 09:26
Dans le tag tu rajoutes ton image de fond par default:
Ca devrait fonctionner
The SMURF
[mailto:the_little_smurf@yahoo.fr the_little_smurf@yahoo.fr]
Enjoy the life, don't waste your time in front of your computer
Ca devrait fonctionner
The SMURF
[mailto:the_little_smurf@yahoo.fr the_little_smurf@yahoo.fr]
Enjoy the life, don't waste your time in front of your computer
cs_Malach
Messages postés
4
Date d'inscription
vendredi 27 mai 2005
Statut
Membre
Dernière intervention
18 novembre 2005
30 juil. 2005 à 15:19
30 juil. 2005 à 15:19
bonjour j aimerai adapter ce script pour une image ( banniere) et non un fond .
Voici deja ce que j ai effectué mais cela ne marche pas, pour information je code sur php.
<script language="javascript" type="text/javascript">
<!--
function taille_ecran() {
var correctwidth=1024
if (screen.width>correctwidth){
mytaillecran = "templates/subSilver/images/test.jpg"
}
if (screen.width<correctwidth){
mytaillecran = "templates/subSilver/images/test800_600.jpg"
}
window.document.getElementsByTagName("body")[0].style.files = "url("+mytaillecran+")";
}
//-->
</SCRIPT>
ensuite je le fais apparaitre comme ceci
mais cela ne marche pas une aide d un pro me serait bien utile
merci d avance
Voici deja ce que j ai effectué mais cela ne marche pas, pour information je code sur php.
<script language="javascript" type="text/javascript">
<!--
function taille_ecran() {
var correctwidth=1024
if (screen.width>correctwidth){
mytaillecran = "templates/subSilver/images/test.jpg"
}
if (screen.width<correctwidth){
mytaillecran = "templates/subSilver/images/test800_600.jpg"
}
window.document.getElementsByTagName("body")[0].style.files = "url("+mytaillecran+")";
}
//-->
</SCRIPT>
ensuite je le fais apparaitre comme ceci
mais cela ne marche pas une aide d un pro me serait bien utile
merci d avance
ptilud2g
Messages postés
1
Date d'inscription
dimanche 19 juillet 2009
Statut
Membre
Dernière intervention
12 août 2009
12 août 2009 à 11:31
12 août 2009 à 11:31
Bonjours à tous et à toutes,
Je sais que cela fait un peu "détérrage" mais suite à diverse recherche sur le sujet je me demandais si il n'existait tout simplement pas un script perettant un "resize" automatique en fonction de la résolution du visiteur (resolution en window.inner, plutot qu'en screen mais ici peut importe puisque qu'à mon avis, si il existe, ce code générerais le même resultat ou presque)
Je sais que cela fait un peu "détérrage" mais suite à diverse recherche sur le sujet je me demandais si il n'existait tout simplement pas un script perettant un "resize" automatique en fonction de la résolution du visiteur (resolution en window.inner, plutot qu'en screen mais ici peut importe puisque qu'à mon avis, si il existe, ce code générerais le même resultat ou presque)