11540 sujets

JavaScript, DOM et API Web HTML5

bonjour ,

je fais des essais pour construire une page web en html5 avec un image de background full-viewport et une musique de fond avec réglage de volume.

j'ai trouvé ce plugin vegas.jaysalvat.com/ pour l'image de fond, qui fonctionne bien.

je me sers aussi de modernizr pour cacher ou non le slider de volume (quand la balise audio n'est pas supportée)

ensuite je mets une balise <audio> avec un volume contrôlé par un slider jquery UI.

Tout marche bien partout sauf... vous l'aurez deviné... dans IE9 où je ne peux pas déplacer mon curseur. Le son se joue mais je ne peux pas actionner le volume.
Quelqu'un a t-il une idée d'où peut venir ce problème?

merci
Salut Lionel,

Je n'ai pas IE donc je ne pourrai pas t'aider, mais juste une simple question. As-tu testé le slider sur une simple page safe sans aucun autre élément pour voir si ce n'était pas un problème lié à ton script. Car ça me semble assez étonnant que cette fonctionnalité ne soit pas supportée par IE9 (le but de jquery c'est quand même aussi d'être cross-browser).
Gili a écrit :
Salut Lionel,

As-tu testé le slider sur une simple page safe sans aucun autre élément pour voir si ce n'était pas un problème lié à ton script..



oui bien sur j'ai essayé et ça marche...

je pense que c'est lié à mon contexte mais je vois pas où, lol
Ah je n'avais pas compris en lisant ton message que tu avais déjà ciblé la problématique. As-tu essayé la même démarche sans le plugin de vegas.jaysalvat.com ? Histoire de voir si c'est plus lié au son ou au background.
J'y comprends rien,
j'ai tout refait depuis le début, étape par étape en incorporant élément par élément et en vérifiant à chaque fois dans IE9, et bien ça marche, maintenant...
il devait y avoir une merde dans mon premier code, mais je sais pas où..

par contre j'ai remarqué que dans iE9 le volume change avec retard lorsque l'on actionne le slider alors que dans firefox ou chrome, la variation de volume suit le curseur instantanément.

autre chose, en local, avec wamp , la balise <audio> n'est pas reconnue dans IE9 !!

voila comment je gère le volume (avec une réponse logarithmique)
#media est l'id de la balise <audio>



	var mediaElem = document.getElementById("media");


	$('#slider').slider({
		value: 40,
		create: setNewVolume,
		slide: setNewVolume
		});




	function setNewVolume() {
	laValue = $('#slider').slider("value");
	laValue = logslider(laValue);
	mediaElem.volume = laValue;	
	}

	function logslider(position) {
	  // position will be between 0 and 100
	  var minp = 0.01;
	  var maxp = 100;
	
	  // The result should be between 100 an 10000000
	  var minv = Math.log(0.01);
	  var maxv = Math.log(1);
	
	  // calculate adjustment factor
	  var scale = (maxv-minv) / (maxp-minp);
	
	  return Math.exp(minv + scale*(position-minp));
	}