Discussion :

[lucaslacarte]

Bonjour à tous,

j'essai en vain de changé l'opacité d'une div en javascript. J'ai réussi à faire disparaître mon élément mais pas en opacité progressive (elle disparaît instantanément).

voici mon code javascript :

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
21
22
23
24
25
26
27
// JavaScript Document
function set_opacity(id, opacity)
{
	el = document.getElementById(id);
	el.style["filter"] = "alpha(opacity="+opacity+")";
	el.style["-moz-opacity"] = opacity/100;
	el.style["-khtml-opacity"] = opacity/100;
	el.style["opacity"] = opacity/100;
	return true;
}
 
$(document).ready(function() {
 
 
 
	$('#menu li').bind('click',function(e){
		$('#menu achat').removeClass('active');
		$(this).addClass('active');
 
 
 
set_opacity('texteAccueil',0);
 
    });
 
 
});

Comment faire en sorte que mon élément disparaît progressivement ?

Merci beaucoup.

[BaBeuH]

Salut,

vu que tu utilises jquery, il y a une fonction qui fait ça plutôt pas mal, c'est la fonction fadeOut().

Ensuite, si tu veux paramétrer l'opacité tel que tu l'as fait dans la fonction set_opacity, tu peux faire :

Code :

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

1
2
3
4
5
 
function set_opacity(id,opacity){
   var element = $("#"+id);
   element.animate({"opacity":opacity}); // opacity variant de 0 à 1
}

Tu peux paramétrer l'effet plus finement, cf la doc de jQuery : http://api.jquery.com/animate/

A+

[lucaslacarte]

Merci pour ta réponse. ça marche nickel.
Par contre mon élément disparaît parfaitement mais l'apparition se fait brutalement. Comment faire ?

[NoSmoking]

Bonjour,
pour ce que tu cherches à réaliser je verrais bien l'utilisation des méthodes

• .fadeOut()
• .fadeIn()

[Bovino]

Sans oublier .fadeTo()