Difference between revisions of "Template:Team:DTU-Denmark/header.html"
| Line 399: | Line 399: | ||
<script> | <script> | ||
| + | |||
| + | // When the user clicks on <span> (x), close the modal | ||
| + | $("span.close").click( function() { | ||
| + | var cl = this.getAttribute('class').split(" ")[1] | ||
| + | var modal = document.getElementById( cl + "Modal" ); | ||
| + | modal.style.display = "none"; | ||
| + | |||
| + | }) | ||
| + | |||
| + | |||
| + | // When the user clicks the image it will enlarge | ||
| + | $("img.enlarge").click( function() { | ||
| + | // Get the modal | ||
| + | var modal = document.getElementById( this.id + "Modal" ); | ||
| + | |||
| + | // Get the image and insert it inside the modal - use its "alt" text as a caption | ||
| + | var img = document.getElementById( this.id ); | ||
| + | var modalImg = document.getElementById( this.id + "Img"); | ||
| + | var captionText = document.getElementById( this.id + "caption" ); | ||
| + | modal.style.display = "block"; | ||
| + | modalImg.src = this.src; | ||
| + | captionText.innerHTML = this.alt; | ||
| + | }) | ||
| + | |||
// Update window when page resizes. | // Update window when page resizes. | ||
var windowWidth = $(window).width(); | var windowWidth = $(window).width(); | ||
Revision as of 14:49, 16 October 2016
