悬停元素A,显示/隐藏元素B
【腾讯云】亏本大甩卖,服务器4核16G 1年370元(带宽12M,系统盘120GB SSD盘,月流量2000GB)!!!!!!
云产品 配置 价格
服务器 1核2G,带宽5M,系统盘50GB SSD盘,月流量500GB 38元/年
MySQL 1核1G 19元/年
服务器 16核32G,带宽18M,系统盘250GB SSD盘,月流量5000GB 1197元/年
点我进入腾讯云,查看更多详情

I have a <div> element containing an image. Inside that div, I have a <p> element which holds some information about the image. I want to hover the <div> containing the image and then show or hide the <p> element.

<div class="box">
    <img src="img/an_039_AN_diskette.jpg" width="310px" height="465px" />
    6 Pharma IT
    <p class="hoverbox">some information</p>
</div>

Is there an easy way to do so in jQuery?

#0

The following will match all of your images, and target their first sibling having the tag P.

<script type="text/javascript">
$(document).ready(function(){
    $("div.box img").hover(
      function(){$(this).siblings("p:first").show();},
      function(){$(this).siblings("p:first").hide();}
    );
});
</script>

<div class="box">
  <img src="somefile.jpg" />
  <p>This text will toggle.</p>
</div>

#1

      $("css_selector_of_img").hover(
      function () {
        $("css_selector_of_p_element").show();
      },
      function () {
        $("css_selector_of_p_element").hide();
      }
      );

See http://docs.jquery.com/Events/hover

#2

$('#divwithimage').hover(
       function(){$('#ptag').show();}, //shows when hovering over
       function(){$('#ptag').hide();} //Hides when hovering finished
);

#3

<div class="box">
    <img ... />
    <p class="hoverbox">Some text</p>
</div>

<script type="text/javascript">
    $('div.box img').hover(
        function() { $('div.box p.hoverbox').show(); },
        function() { $('div.box p.hoverbox').hide(); }
    );
</script>

推荐文章

Django下载文件不工作

Django下载文件不工作

推荐文章

CSS form[action]不处理查询字符串

CSS form[action]不处理查询字符串

推荐文章

为什么要加密用户密码?

为什么要加密用户密码?

推荐文章

在数组位置的C#GetType().GetField

在数组位置的C#GetType().GetField

推荐文章

如何将URL裁剪/剥离到页面名称?

如何将URL裁剪/剥离到页面名称?

推荐文章

网络控制和IDisposable

网络控制和IDisposable

推荐文章

何时在Java中使用异常(示例)

何时在Java中使用异常(示例)

推荐文章

在静态FBML中可以使用JavaScript或PHP吗?

在静态FBML中可以使用JavaScript或PHP吗?

推荐文章

Numpy转置乘法问题

Numpy转置乘法问题

推荐文章

WindowedApplication的Flex 4/Air设置界限

WindowedApplication的Flex 4/Air设置界限

推荐文章

泛型方法调用无法从类名转换为完整类名

泛型方法调用无法从类名转换为完整类名

推荐文章

Ruby读取编码为GB2313的网页,如何检查内容是否包含关键字?

Ruby读取编码为GB2313的网页,如何检查内容是否包含关键字?

推荐文章

为什么我不能用'??'System.DBNull值的操作数?

为什么我不能用'??'System.DBNull值的操作数?

推荐文章

模拟用户输入,使用不同参数多次调用脚本

模拟用户输入,使用不同参数多次调用脚本

推荐文章

Vim的omnicompletion在Python中使用“from”导入失败

Vim的omnicompletion在Python中使用“from”导入失败

推荐文章

通过twitter、facebook、gmail等寻找朋友

通过twitter、facebook、gmail等寻找朋友