Discussion :

[mcyann]

Bonjour,
J'ai un soucis qui je pense est lié à la porté des variables.
J'ai écrit ça :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
var largeur_fenetre;
var slide_largeur;
var centre_slide;
$(window).load(function() {
    $(window).resize(function() {
        var largeur_fenetre = $(window).width();
        var slide_largeur = $(".img_slide").width();
        var centre_slide = (largeur_fenetre / 2) - (slide_largeur) / 2;
    });
    console.log(slide_largeur);
    //....suite du code....
});

Donc j'ai lu que si on déclare une variable au début du script avant toute fonction, elle devient une variable globales, utilisable dans tout le script.
Mais qu'est ce qui ne va pas dans mon cas?
Le console.log me renvoie 'undefined'

Merci d'avance pour vos éclairages.
Cordialement

[Invité]

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
$( window ).load(function() {
 
       $( window ).resize(function() {

??

[mcyann]

Bonjour jreaux62,
en fait le window.load, me permet de ne charger le script qu'une fois le site chargé (un précédent post ou tu m'avait donné l'astuce) et le window.rezise devrait me permettre de gérer a la volée la modification des éléments graphique du site (des images qui forme un panoramique) lors des changements de taille des fenêtres (mais peut être suis-je partie sur un mauvais chemin...).
Par exemple sur une tablette si je passe du mode paysage a portrait, le résultat est pas terrible...
C'est visible ici : https://chateauargenties.live-website.com éventuellement...

[Invité]

Oui, mais ils ne sont pas censés s'imbriquer.
Mais tu te trompes sur la définition de window.load : ça signifie "au chargement de page" *

Soit :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
$( window ).load(function() {
 ...
});
$( window ).resize(function() {
 ...
});

Soit ensemble :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
$( window ).on('load resize', function() {
 ...
});

* N.B. il me semble que SpaceFrog t'a conseillé de t'intéresser aussi à :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

$(function(){

qui est équivalent à :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

$(document).ready(function(){

[mcyann]

Ok, je vais refaire ça en deux étapes alors, merci beaucoup.
Je vous dit si j'ai réussis a faire ce que je veux!!!
Pour space Frog, ça n'était pas moi... Mais je note!

[Invité]

Pour space Frog, ça n'était pas moi... Mais je note!

Exact !

[NoSmoking]

Bonjour,

J'ai un soucis qui je pense est lié à la porté des variables.

OUI !

Le console.log me renvoie 'undefined'

si l'on reprend ton code, on voit que :

• ligne #2 :var slide_largeur;, déclaration d'une variable globale non initialisée, donc valant à cette endroit undefined ;

• ligne #7 :var slide_largeur = $(".img_slide").width();, déclaration d'une nouvelle variable, utilisation du mot clé var, dans le « scope » de la fonction $(window).resize(function() ;

• ligne #10: console.log(slide_largeur);, affichage de la variable nommée slide_largeur qui est celle déclarée à la ligne #2, ce n'est donc pas la même que celle de la ligne #7 qui est hors « scope », après la fonction dans laquelle tu l'as déclarée.

Pour en savoir plus :
↪ Déclaration de variables (sur MDN)

[mcyann]

Bonjour,
alors pour faire suite a mon post, j'ai trouvé la solution avec la fonction :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

window.addEventListener("resize", displayWindowSize);

plutôt que

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

$( window ).resize(function() {

.
Ça marche pour moi comme ça.
Merci pour les portées de variables, j'ai compris comment ça fonctionne!
Encore merci pour vos conseil, il me reste un bug, mais je vais devoir me débrouiller tout seul pour le résoudre.
Bonne journée