Template:Sifuentes04

From 2014.igem.org

(Difference between revisions)
Line 280: Line 280:
border-radius: 5px;
border-radius: 5px;
}
}
-
 
-
 
-
 
-
#imageWrap {
 
-
    width: 150px;
 
-
    height: 150px;
 
-
    background: url('ajax-loader.gif') center center no-repeat;
 
-
}
 
</style>
</style>
Line 300: Line 292:
<script ="text/javascript">
<script ="text/javascript">
-
 
-
 
-
$(document).ready(function() {
 
-
    $('.thumbnail').live("click", function() {
 
-
        $('#mainImage').hide();
 
-
        $('#imageWrap').css('background-image', "url('ajax-loader.gif')");
 
-
        var i = $('<img />').attr('src',this.href).load(function() {
 
-
            $('#mainImage').attr('src', i.attr('src'));
 
-
            $('#imageWrap').css('background-image', 'none');
 
-
            $('#mainImage').fadeIn();
 
-
        });
 
-
        return false;
 
-
    });
 
-
});
 
Line 508: Line 486:
-
<a href="image1.jpg" class="thumbnail"><img src="http://upload.wikimedia.org/wikipedia/commons/d/dd/Kiwi_in_Clogs.JPG" width="150px" height="150px"
 
-
  alt="Image 1"/></a>
 
-
<a href="image2.jpg" class="thumbnail"><img src="http://www.giallozafferano.it/images/prodotti/kiwi.jpg" width="150px" height="150px"
 
-
  alt="Thumbnail 2"/></a>
 
-
 
 
-
<div id="imageWrap">
 
-
  <img src="http://upload.wikimedia.org/wikipedia/commons/d/dd/Kiwi_in_Clogs.JPG" width="150px" height="150px" alt="Main Image" id="mainImage"/>
 
-
</div>
 
</div> <!-- this closes the menu div -->
</div> <!-- this closes the menu div -->

Revision as of 22:16, 12 January 2015