11548 sujets

JavaScript, DOM et API Web HTML5

Bonjour à tous,

je suis en train de mettre à jour un script que j'ai trouvé sur le net pour le rendre conforme "aux exigences actuelles en matière de développement web" (sémantique, xhtml, css, accessibilité...) et lui ajouter quelques fonctionnalités.

Ce script intercepte l'événement alert() pour le remplacer par une fausse boite de dialogue qui a la même fonction. Jusque là tout va bien. Mais problème, si le css est désactivé le code la boite de dialogue est appelé en fin de page (et donc non visible). J'aurais voulus savoir si vous connaissiez un moyen pour en JS tester si le CSS est activé sachant que je travaille avec Prototype et script.aculo.us (dernières versions). Ce qui me permettrait de n'exécuter mon JS que si le CSS est activé.
Modifié par Spy-Seth (02 Jun 2008 - 01:40)
Modérateur
Salut,

Il est possible de vérifier la présence de css en testant si offsetWidth renvoie la bonne valeur d'un conteneur auquel tu as donné une largeur et un padding.
Si la valeur renvoyée est correcte, css est actif et donc tu lances ton script... sinon, tu annules tout.
Je me doutait bien que c'était un truc du genre qu'il fallait faire Smiley lol


Donc ta technique marche très bien, ça détecte parfaitement le statut des CSS, merci beaucoup.

function testCss(){
	var cssBoxSize = new Array(50,15); // array [  width , height ]
	
	var cssBox = document.createElement('div');
	cssBox.id = 'cssBox';
	cssBox.style.position = 'absolute';
	cssBox.style.width = cssBoxSize[0]+'px';
	cssBox.style.height = cssBoxSize[1]+'px';
	
	document.body.appendChild(cssBox);
	
	var cssBoxTest = new Array($('cssBox').getWidth(), $('cssBox').getHeight()); // array [  width , height ]
	
	if ( ( cssBoxSize[0] == cssBoxTest[0] ) && ( cssBoxSize[1] == cssBoxTest[1] )) {
		return true
	}
	else {
		return false
	}
}



Mais maintenant je rencontre un autre problème dans l'activation de mon script. Jusqu'à maintenant je "charger" le script via :
Event.observe(window, 'load', initMsgBox, false);

Je pensais donc faire ce qui suis en début de code JS :
	if (testCss()) {	
	Event.observe(window, 'load', initMsgBox, false);
	}


Mais il ne me le lance pas Smiley ohwell (pourtant testCss() retourne bien true)


Vous auriez une idée ?
Modifié par Spy-Seth (01 Jun 2008 - 12:43)