单击/悬停时在div中显示缩略图图像

时间:2012-10-31 18:10:37

标签: jquery

只想在点击或悬停时在.fullsizeimage中显示.thumbimage - 遗憾的是./64功能没有运气。

http://jsfiddle.net/CUZBa/ - 小提琴以防万一!

 <div class="row">  
        <div class="fullsizeimage">
            <img src="https://www.houseplans.com/img/980e/461-2p1-2520_plan-detail.jpg" />
        </div>

    <div class="thumbimage"><a href="#"><img src="https://www.houseplans.com/img/85cd/461-2e-2520_plan-detail.jpg" width="100" height="100"></a></div>
    <div class="thumbimage"><a href="#"><img src="https://www.houseplans.com/img/872d/461-2alt1-2520_plan-detail.jpg" width="100" height="100"></a></div>
    <div class="thumbimage"><a href="#"><img src="https://www.houseplans.com/img/230e/461-2alt2-2520_plan-detail.jpg" width="100" height="100"></a></div>
</div>

<script src="" type="text/javascript">
$('.thumbimage a').on('click hover',function(){
    $('.fullsizeimage img').attr('src',$(this).attr('src'));
});
</script>

2 个答案:

答案 0 :(得分:1)

src=""标记中删除<script>属性。

http://jsfiddle.net/CUZBa/6/

答案 1 :(得分:1)

  1. 选择jquery框架。
  2. 从代码中删除脚本代码