Question

I am curious to know, how you target a child, when hover on a parent?

How I would do in CSS:

parent:hover child {
background-color: #FFFFFF;
}

How do you do this in jQuery? “.medarbejdere .info span.kontaktinfo” is my Parent. I would like $(this) to be my child.

var navDuration = 150; //time in miliseconds
  var forstoer = "150px";

  $('.medarbejdere .info span.kontaktinfo').hover(function() {
      $(this).animate({ 'right' : "+="+forstoer }, navDuration);            
  }, function() {
      $(this).animate({ 'right' : "-150px" }, navDuration);
    });

Thank you in advance…

Answer 1

Use $(this).children().

Ex:

var navDuration = 150; //time in miliseconds 
var forstoer = "150px"; 

$('.medarbejdere .info span.kontaktinfo').hover(function() { 
    $(this).children().animate({ 'right' : "+="+forstoer }, navDuration);             
}, function() { 
    $(this).children().animate({ 'right' : "-150px" }, navDuration); 
});