在鼠标悬停时显示 div 对象？答案

【问题标题】：Show div objects on mouse over?在鼠标悬停时显示 div 对象？
【发布时间】：2013-10-21 03:11:55
【问题描述】：

我正在尝试制作一个 JavaScript 函数来说明标注 div 和缺口 div 是隐藏的，但是当鼠标悬停在 contact_details_email 上时会淡入标注和缺口，然后鼠标离开 contact_details_email 时会淡出标注和缺口。

我是 JavaScript 新手，谁能告诉我我需要做什么？

<script>
     $(".callout").hide();
     $(".notch").hide();
        $('.contact_details_email').onMouseOver(function(){

                $('.callout').fadeIn(500);
                 $('.notch').fadeIn(500);


        });
    </script>

【问题讨论】：

你能分享你的html吗？
由于您使用的是类，而不是 ID，我猜您想淡化特定于父 div (.contact_details_email) 的 .callout 和 .notch div。是这样吗？
查看我针对相应子 div 的修改后的答案

标签： javascript

【解决方案1】：

jQuery 的 mouseover 事件的一般格式如下（根据您可以在 http://api.jquery.com/hover/ 找到的优秀文档）

$(selector).hover(function(){
    //mouseover handler
}, function(){
    //mouseout handler
})

假设 .callout 和 .notch 是 .contact_details_email 的后代...

$('.contact_details_email').hover(function(){
    //mouseover handler
    $(this).find('.callout').fadeIn(500);
    $(this).find('.notch').fadeIn(500);
}, function(){
    //mouseout handler
    $(this).find('.callout').fadeOut(500);
    $(this).find('.notch').fadeOut(500);
});

【讨论】：

【解决方案2】：

希望the link对你有用，对jquery documentation有帮助

【讨论】：