Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
  
  
  
<div class="bottlesWrapper">
  <img src="http://placehold.it/300x160/cf5" />
</div>
<div class="thumbs">
   <img src="http://placehold.it/300x160/444" />
   <img src="http://placehold.it/300x160/f1f" />
</div>  
  
  
  
</body>
</html>
 
.thumbs img{
  margin-right:3px;
  margin-top:3px;
  width:148px;
  float:left;
}
 
$('.thumbs img').click(function() {
    var thmb = this;
    var src = this.src;
    $('.bottlesWrapper img').fadeOut(400,function(){
        thmb.src = this.src;
        $(this).fadeIn(400)[0].src = src;
    });
});
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers