CODEWITHSUNDEEP
jqueryhtmlcss
el_pup_le
el_pup_le

Reputation: 12179

Triggering a hover or mouseover to get a defined CSS effect

I've tried to trigger a hover event on a previous row in a table so I could get it's effect defined in CSS but it's not working. Basically what I have is 2 rows joined that need this border effect for mouseovers whenever either row moused over. What is a solution in jQuery for this?

jQuery

$("tr").hover(function() {
  $(this).prev().trigger('mouseover');
});

CSS

tr:hover .row-right {
  border-right: 10px solid #CCC;
}

Upvotes: 4

Views: 833

Answers (1)

Yaron U.
Yaron U.

Reputation: 7881

jQuery

 $("tr").mouseover(function() {
    $(this).prev().addClass('hover');
 });
 $("tr").mouseout(function() {
    $(this).prev().removeClass('hover');
 });

CSS

 tr.hover .row-right {
    border-right: 10px solid #CCC;
  }

jsFiddle link for this: http://jsfiddle.net/vsApc/

Upvotes: 1

Related Questions