arona/website
1
0
Fork 0
Code Issues 1 Pull Requests Releases Activity

Click to expand tests

Browse Source
This commit is contained in:
Arona Jones
2014-11-14 14:11:07 +00:00
parent e03607e3b2
commit 7b4d1a6cad
3 changed files with 42 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
art/record.html
View File

@@ -30,6 +30,7 @@
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.2/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
<script src="/javascripts/custom.js"></script>
</head>
<body>
@@ -283,7 +284,9 @@
<div class="row">
<div class="col-xs-6 col-md-3">
<a href="#" class="thumbnail">
<img src="/images/art/ai/clock1grad.jpg" alt="...">
<img src="/images/art/ai/clock1grad.jpg" alt="..." style="cursor:pointer" onclick="showImage('/images/art/ai/clock1grad.jpg');">
<div id="largeImgPanel" onclick="hideMe(this);">
<img id="largeImg" style="height: 100%; margin: 0; padding: 0;"></div>
</a>
</div>
<div class="col-xs-6 col-md-3">

23
css/custom.css
View File

@@ -1,5 +1,5 @@
.media {
width:60px;
width: 60px;
position: absolute;
top: 200px;
right: 0px;
@@ -15,5 +15,22 @@
margin-bottom: 5px;
margin-top: 5px;
}
#leftcolumn { width: 50%; float: left}
#rightcolumn { width: 50%; float: right}
#leftcolumn {
width: 50%;
float: left
}
#rightcolumn {
width: 50%;
float: right
}
#largeImgPanel {
text-align: center;
visibility: hidden;
position: fixed;
z-index: 100;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(100, 100, 100, 0.5);
}

18
javascripts/custom.js Normal file
View File

@@ -0,0 +1,18 @@
function showImage(imgName) {
document.getElementById('largeImg').src = imgName;
showLargeImagePanel();
unselectAll();
}
function showLargeImagePanel() {
document.getElementById('largeImgPanel').style.visibility = 'visible';
}
function unselectAll() {
if (document.selection) document.selection.empty();
if (window.getSelection) window.getSelection().removeAllRanges();
}
function hideMe(obj) {
obj.style.visibility = 'hidden';
}