Rouge Rouge - 1 year ago 87
Javascript Question

Jquery overlapping effect issue

I am trying to listen to an element effects on overlapping elements. I only want the hover effect on itemB when I hover to element B. However, since element B is on top of element A, the hover effect on element A also shows up. Are there anyways to solve this? Thanks a lot.

my jsfiddle


Try this

Work exactly like what you want. jQuery has mouseleave and mouseout events which fires only once.

You can use hover also but when you have many elements with in A & B each time you change mouse position form one element to other hover will fire. You don't need that to be fired unless mouse moves out of B.

$(document).ready(function() {

 var overA = function(){
  var outOfA = function(){

  var overB = function(e){

var outOfB = function(){