Discussion :

[team94]

Bonjour à vous,

Je voudrais changer de fichier javascript dynamiquement en fonction de la résolution de mon écran.

j'ai fait quelques recherche et je suis tombé sur matchmedia, seulement je n'arrive pas à l'adapter je vous poste mon code :

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
 
if(window.matchMedia("(min-width:800px)").matches) {
	// on charge le 1er fichier
	var script1 = document.createElement('script');
	script1.type='text/javascript';
	script1.src = './script/prog1/chrono1.js';
	// Insertion dans le DOM
	document.getElementsByTagName('head')[0].appendChild(script1);
} else {
	// On charge l'autre fichier js
	var script2= document.createElement('script');
	script2.type='text/javascript';
	script2.src = './script/prog1/chrono.js';
	// Insertion dans le DOM
	document.getElementsByTagName('head')[0].appendChild(script2);
}

le premier fichier et bien chargé mais quand je redimensionne la fenêtre rien ne se passe ?

quelqu'un pourrais m'aider ?

merci d'avance.

[Bovino]

Code :

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

// Fonction exécutée au redimensionnement

On pourrait voir comment est appelée cette fonction ?

[team94]

aie c'étais le résidu d'un autre test désolé

[SpaceFrog]

oui donc si tu ne lances pas la fonction sur l'évènement de redimension ... il y a peu de chance que le code soit exécuté lors de la redimension

[team94]

ok cool merci de ta réponse

effectivement avec la fonction ça marche mieux ;-)

je re-poste le code modifié mais il subsiste deux problèmes

le premier lorsque je modifie la taille lorsque l'on passe au dessous des 800px il faut recharger manuellement la page pour que le second script soit pris en compte.

le second lorsque je regarde le code dans le navigateur avec firebug il m’écrit plein de ligne <script> lorsque je redimensionne. Moi je voudrais qu'il supprime l'ancienne et qu'il m’écrive la nouvelle lorsque j'arrive au dessous de 800 px.

je reposte mon code :

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
// Fonction exécutée au redimensionnement
function redimensionnement() {
  if("matchMedia" in window) { // Détection
	if(window.matchMedia("(min-width:800px)").matches) {
		var script1 = document.createElement('script');
		script1.type='text/javascript' ;
		script1.src = './script/prog1/chrono1.js';
		// Insertion dans le DOM
		document.getElementsByTagName('head')[0].appendChild(script1);
	} else {
		var script2= document.createElement('script');
		script2.type='text/javascript';
		script2.src = './script/prog1/chrono.js';
		// Insertion dans le DOM
		document.getElementsByTagName('head')[0].appendChild(script2);	
	}
  }	
}
window.addEventListener('resize', redimensionnement, false);
redimensionnement();

encore merci à vous.