在jquery中将alt文本作为图像标签回显的问题

时间:2010-06-30 17:07:45

标签: jquery html

我正在研究jquery脚本以显示翻转,现在我需要在div框中显示每个图像替代文字

这是我的jquery代码:

$(document).ready(function(){


$("ul.thumb li").hover(function() {
    $(this).css({'z-index' : '10'});
    $(this).

    find('img').addClass("hover").stop()
        .animate({
            width: '174px', 
            height: '174px',
        }, 200);

    } , function() {
    $(this).css({'z-index' : '0'});
    $(this).find('img').removeClass("hover").stop()
        .animate({
            width: '100px', 
            height: '100px', 
        }, 400);
});

    $("ul.thumb li a").click(function() {

        var mainImage = $(this).attr("href"); //Find Image Name
        $("#main_view img").attr({ src: mainImage });
        return false;       
    });

});

和html:

<ul class='thumb'>
<li><a href='#'><img src='path' alt='this-text'></a></li>
<li><a href='#'><img src='path' alt='this-text'></a></li>
<li><a href='#'><img src='path' alt='this-text'></a></li>
</ul>
<div id='imglabel'></div>

现在我如何在

中显示每个图像的alt值
  

div id ='imglabel'

关于鼠标悬停效果,因为它悬停

1 个答案:

答案 0 :(得分:1)

您可以遍历每个图像并将其alt属性附加到imglabel:

  $("#imglabel").mouseover(function() {

      $("img").each(function() {

          $("#imglabel").append($(this).attr('alt'));
      })
  }).mouseout(function() {

      $(this).empty();
  })