Hover behaviour issue with jQuery

I have the follow jQuery event binding. Refer to the image below to see the DOM. The hover callbacks behave correctly when hovering over `.gift-price`, `.gift-vendor`, and `.gift-name`. However, when hovering over the image (`.gift-photo`), the `mouseenter` and `mouseleave` callbacks are called for every movement of the mouse. Why is this happening? Thanks! $('div.gift-gallery-item').hover( function(e) { var offset = $(this).offset(); var itemWidth = $(this).width(); var itemHeight = $(this).height(); var hoverItem = $('div#gift-gallery-item-hover'); hoverItem.height(140).width(itemWidth * 2); hoverItem.css('left', offset.left).css('top', offset.top); hoverItem.show(); console.log('in: ' + offset.left +', '+ offset.top); console.log(this); }, function(e) { $('div#gift-gallery-item-hover').hide(); console.log('out!'); } ) ### DOM Reference Image The yellow boxes are `.gift-gallery-item` divs

以上就是Hover behaviour issue with jQuery的详细内容,更多请关注web前端其它相关文章!

赞(0) 打赏
未经允许不得转载:web前端首页 » JavaScript 答疑

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

前端开发相关广告投放 更专业 更精准