Template:Team:Macquarie Australia/About

From 2014.igem.org

(Difference between revisions)
 
(7 intermediate revisions not shown)
Line 1: Line 1:
{{Team:Macquarie_Australia/TopNavBar}}
{{Team:Macquarie_Australia/TopNavBar}}
-
<html>
+
<html>photo
<head>
<head>
<link href="https://2014.igem.org/Template:Team:Macquarie_Australia/css/global?action=raw&ctype=text/css" rel="stylesheet">
<link href="https://2014.igem.org/Template:Team:Macquarie_Australia/css/global?action=raw&ctype=text/css" rel="stylesheet">
<script src="https://2014.igem.org/Team:Macquarie_Australia/js/popup?action=raw&ctype=text/javascript" type="text/javascript""></script>
<script src="https://2014.igem.org/Team:Macquarie_Australia/js/popup?action=raw&ctype=text/javascript" type="text/javascript""></script>
 +
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
 +
<script>
 +
var modal = (function(){
 +
var
 +
method = {},
 +
$overlay,
 +
$modal,
 +
$photo,
 +
$close;
 +
 +
// Center the modal in the viewport
 +
method.center = function () {
 +
var top, left;
 +
 +
top = Math.max($(window).height() - $modal.outerHeight(), 0) / 2;
 +
left = Math.max($(window).width() - $modal.outerWidth(), 0) / 2;
 +
 +
$modal.css({
 +
top:top + $(window).scrollTop(),
 +
left:left + $(window).scrollLeft()
 +
});
 +
};
 +
 +
// Open the modal
 +
method.open = function (settings) {
 +
$photo.empty().append(settings.photo);
 +
 +
$modal.css({
 +
width: settings.width || 'auto',
 +
height: settings.height || 'auto'
 +
});
 +
 +
method.center();
 +
$(window).bind('resize.modal', method.center);
 +
$modal.show();
 +
$overlay.show();
 +
};
 +
 +
// Close the modal
 +
method.close = function () {
 +
$modal.hide();
 +
$overlay.hide();
 +
$photo.empty();
 +
$(window).unbind('resize.modal');
 +
};
 +
 +
// Generate the HTML and add it to the document
 +
$overlay = $('<div id="overlay"></div>');
 +
$modal = $('<div id="modal"></div>');
 +
$photo = $('<div id="photo"></div>');
 +
$close = $('<a id="close" href="#">close</a>');
 +
 +
$modal.hide();
 +
$overlay.hide();
 +
$modal.append($photo, $close);
 +
 +
$(document).ready(function(){
 +
$('body').append($overlay, $modal);
 +
});
 +
 +
$close.click(function(e){
 +
e.preventDefault();
 +
method.close();
 +
});
 +
 +
return method;
 +
}());
 +
 +
// Wait until the DOM has loaded before querying the document
 +
$(document).ready(function(){
 +
 +
$.get('ajax.html', function(data){
 +
modal.open({photo: data});
 +
});
 +
 +
$('a#eddie').click(function(e){
 +
modal.open({photo: ""});
 +
e.preventDefault();
 +
});
 +
});
 +
</script>
 +
</head>
</head>
<body>
<body>
-
<div id=“coverBack”></div>
+
<div id=“overlay”></div>
<section id="Content">
<section id="Content">
<h1>About the team!</h1>
<h1>About the team!</h1>
Line 12: Line 94:
<p>
<p>
<div id="modal">
<div id="modal">
-
<div id="photo">Click!!!</div>
+
<a href="#" id="eddie">Eddie Park</div>
-
<a href="#" id="close">close</a>
+
</div>
</div>
</p>
</p>

Latest revision as of 05:55, 21 August 2014

photo

About the team!

The students

Retrieved from "http://2014.igem.org/Template:Team:Macquarie_Australia/About"