Jquery - aide pour page d'accueil complexe

Jquery - aide pour page d'accueil complexe - HTML/CSS - Programmation

Marsh Posté le 31-05-2014 à 12:26:20    

Salut,  
 
Nous somme entrain de préparer un site d'archi pour présenter nos projets.
 
http://www.why-how-what.eu
 
J'ai cependant un petit problème sur la page de la liste des projets : http://www.why-how-what.eu/projects.html
 
Je voudrais que quand la souris rentre sur une div, celle-ci change d'opacité ainsi que ses deux voisines.
 
Le problème est que je n'arrive pas à adoucir cet effet quand la souris sort de la div. Si je défini la durée de l'effet dans jquery, un clignotement apparait quand je déplace la souris.
 
voici le code jquery pour une ligne de trois vignettes:
 

Citation :

$('#bwhy').hover(
function() {
$(this).stop().animate({"opacity": "0"}, 0);
},
function() {
$(this).stop().animate({"opacity": "1"}, 0);
});
 
 $('#bwhy').hover(
function() {
$('#bhow').animate({"opacity": "0.5"}, 0);
},
function() {
$('#bhow').animate({"opacity": "1"}, 0);
});
 
 $('#bwhy').hover(
function() {
$('#bwhat').animate({"opacity": "0.5"}, 0);
},
function() {
$('#bwhat').animate({"opacity": "1"}, 0);
});
 
 
 
 
   
 $('#bhow').hover(
function() {
$(this).stop().animate({"opacity": "0"}, 0);
},
function() {
$(this).stop().animate({"opacity": "1"}, 0);
});
 
 $('#bhow').hover(
function() {
$('#bwhy').animate({"opacity": "0.5"}, 0);
},
function() {
$('#bwhy').animate({"opacity": "1"}, 0);
});
 
 $('#bhow').hover(
function() {
$('#bwhat').animate({"opacity": "0.5"}, 0);
},
function() {
$('#bwhat').animate({"opacity": "1"}, 0);
});
 
 
 
 
   
 $('#bwhat').hover(
function() {
$(this).stop().animate({"opacity": "0"}, 0);
},
function() {
$(this).stop().animate({"opacity": "1"}, 0);
});
 
 $('#bwhat').hover(
function() {
$('#bwhy').animate({"opacity": "0.5"}, 0);
},
function() {
$('#bwhy').animate({"opacity": "1"}, 0);
});
 
 $('#bwhat').hover(
function() {
$('#bhow').animate({"opacity": "0.5"}, 0);
},
function() {
$('#bhow').animate({"opacity": "1"}, 0);
});


 
Merci d'avance pour votre aide !
 
Nico

Reply

Marsh Posté le 31-05-2014 à 12:26:20   

Reply

Marsh Posté le 02-06-2014 à 16:36:42    

Salut,
 
Je pense que dois utiliser les function fadeIn et FadeOut pour effectuer des effets à l'entrer et à la sortie de ta div.
 
Ici pour ceux que tu souhaite faire tu doit faire  
 

Code :
  1. $('#bwhy').animate({"opacity": "0.5"}.fadeOut("slow" );


 
Tu peux mettre un temps en ms aussi.
 
PS : J'espère que ça pausera pas de problème avec animate


Message édité par OrcusZ le 02-06-2014 à 16:37:54

---------------
Made you your own sentence without believing that of the others...
Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed