Line 73: | Line 73: | ||
<!--Thumbnail grid--> | <!--Thumbnail grid--> | ||
− | <a | + | <!-- image1 --> |
− | + | <a href="#" class="pop"> | |
− | <!-- | + | <img src="http://patyshibuya.com.br/wp-content/uploads/2014/04/04.jpg" style="width: 400px; height: 264px;"> |
− | <div class="modal fade" id=" | + | </a> |
− | + | ||
− | + | <!-- image2 --> | |
− | + | <a href="#" class="pop"> | |
− | + | <img src="http://upload.wikimedia.org/wikipedia/commons/2/22/Turkish_Van_Cat.jpg" style="width: 400px; height: 264px;"> | |
− | + | </a> | |
− | + | ||
− | + | <!-- The modal--> | |
− | + | <div class="modal fade" id="imagemodal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> | |
− | + | ||
− | + | <div class="modal-dialog"> | |
− | + | <div class="modal-content"> | |
− | </ | + | <div class="modal-body"> |
− | + | <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button> | |
+ | <img src="" class="imagepreview" style="width: 100%;" > | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | <script> | ||
+ | |||
+ | $(function() { | ||
+ | $('.pop').on('click', function() { | ||
+ | $('.imagepreview').attr('src', $(this).find('img').attr('src')); | ||
+ | $('#imagemodal').modal('show'); | ||
+ | }); | ||
+ | }); | ||
+ | </script> | ||
</body> | </body> | ||
</html> | </html> | ||
{{Team:DTU-Denmark/footer}} | {{Team:DTU-Denmark/footer}} |
Revision as of 11:46, 16 October 2016
This is heading 1
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed eget ornare orci. Etiam sodales molestie felis quis condimentum. Aliquam vel sem fringilla, egestas justo sit amet, tincidunt augue. Nam maximus arcu sit amet eros rutrum commodo. Quisque fermentum dapibus tristique. Fusce eu neque euismod, commodo arcu maximus, rutrum magna. Proin eget cursus dui, eu bibendum lacus. Sed ac accumsan mi. Mauris at pulvinar turpis. Nulla bibendum nec felis ut fringilla. Morbi ac faucibus ex. Ut eleifend libero non rhoncus tristique. Mauris vel ornare massa. In congue, tellus semper condimentum porta, turpis tortor porta est, ac blandit elit velit vitae ex. Cras in lectus ligula. Praesent tincidunt dui et libero commodo, vitae cursus elit finibus.
Maecenas porta vitae turpis vel lacinia. Phasellus nisl urna, auctor at placerat ac, faucibus sed ligula. Phasellus arcu nunc, elementum eget pellentesque eget, dignissim vel erat. Nullam augue urna, viverra facilisis aliquet eu, dapibus id ex. Vivamus at ipsum congue, imperdiet libero et, pretium velit. Cras vel finibus erat, ac aliquet felis. Sed congue tellus vel justo cursus, id eleifend massa scelerisque. Donec pharetra ipsum sed neque aliquet, non accumsan velit pharetra. Quisque egestas condimentum tellus id blandit. Praesent in sollicitudin turpis. Proin efficitur ut est vitae sodales. Fusce tristique, diam at pulvinar feugiat, magna dolor fringilla arcu, vel semper massa elit vel nunc. Vivamus dapibus congue odio ut varius. Nullam nunc neque, scelerisque at turpis faucibus, elementum hendrerit mi. Fusce tristique dapibus lectus quis dapibus.
Cras eget faucibus odio. Aenean pharetra elit ut metus tristique, eget blandit lorem tincidunt. Integer quis justo ac dolor accumsan lobortis vitae sit amet enim. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur eros lectus, feugiat sodales fermentum quis, mattis congue velit. Aenean tempor dolor vitae nisl dignissim, sit amet aliquet neque malesuada. Nullam in neque eu tortor egestas tincidunt. Fusce suscipit odio posuere nisl hendrerit volutpat. Curabitur ornare mauris ac magna viverra hendrerit. Nulla facilisi. Quisque venenatis vitae elit consequat posuere. Cras non turpis maximus, volutpat massa dignissim, fermentum augue. Sed venenatis diam eu lacus cursus pulvinar. Maecenas urna turpis, venenatis eget nunc fringilla, dignissim luctus purus. Sed faucibus arcu a lacus condimentum blandit.