Joe Isaacson
Joe Isaacson

Reputation: 4132

Show thumbnail image in div on click / hover

Simply want to show the .thumbimage within the .fullsizeimage on click or hover - unfortunately no luck with the .attr function.

http://jsfiddle.net/CUZBa/ - Fiddle just in case!

 <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>

Upvotes: 0

Views: 870

Answers (2)

001
001

Reputation: 13533

  1. Choose the jquery framework.
  2. Remove script tag from your code

Upvotes: 1

egbrad
egbrad

Reputation: 2417

Remove the src="" attribute from your <script> tag.

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

Upvotes: 1

Related Questions