html 点击图片显示文本

发布网友

我来回答

共4个回答

热心网友

鼠标移动到图片上，显示文字，简单的方法是利用“title”。
例如：
<img src="/index/4.png" alt="HTML5在线制作" title="HTML5在线制作">
鼠标移动到4.png图片上时候，显示出“HTML5在线制作”

热心网友

$(function(){
  $(".tab_name td img").click(function(){
      var index = $(this).parent("td").index();
      var name = $(".tab_name tr:eq(1) td:eq("+index+")").html();
      alert(name);
  })
})
<table class="tab_name">
  <tr>
     <td><img src="images/big1.jpg" style="width:120px;height:90px" /></td>
     <td><img src="images/big2.jpg" style="width:120px;height:90px" /></td>
     <td><img src="images/big3.jpg" style="width:120px;height:90px" /></td>
 </tr>
 <tr>
      <td align="center">郭沫若</td>
       <td align="center">钱学森</td>
       <td align="center">鲁迅</td>
  </tr>
</table>

热心网友

$(function(){
    $("table").delegate("img","click",function(){
        var i = $(this).index("img");
        var name = $("td[align]:eq("+i+")").text();
        alert(name);
    });
});

热心网友

按程序设计来说名字和照片放一起比较好。