Team:KAIST Korea/Team

From 2013.igem.org

(Difference between revisions)
Line 3: Line 3:
<head>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
-
+
<meta charset="UTF-8">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="generator" content="MediaWiki 1.16.5" />
<meta name="generator" content="MediaWiki 1.16.5" />
Line 19: Line 19:
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/jquery-ui.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/jquery-ui.min.js"></script>
<script type="text/javascript" src="http://coulisse.luvdasun.com/assets/jquery.ui.coulisse.min.js"></script>
<script type="text/javascript" src="http://coulisse.luvdasun.com/assets/jquery.ui.coulisse.min.js"></script>
 +
<style type="text/css">
 +
 +
body{
 +
background: #333;
 +
color: #fff;
 +
font: 85% Lucida Grande, Lucida Sans Unicode;
 +
position: relative;
 +
}
 +
 +
#container{
 +
margin: 30px auto;
 +
width: 602px;
 +
}
 +
 +
#controls{
 +
margin-bottom: 20px;
 +
}
 +
 +
#__cvfl-coverflow{
 +
height: 375px;
 +
margin: auto;
 +
overflow: hidden;
 +
position: relative;
 +
width: 530px;
 +
}
 +
 +
#__cvfl-coverflow-label{
 +
color: #fff;
 +
font: 14pt Lucida Grande, Lucida Sans Unicode;
 +
line-height: 1.3em;
 +
position: relative;
 +
text-align: center;
 +
top: 273px;
 +
z-index: 700;
 +
}
 +
 +
#content h1{
 +
margin: 30px 0 10px;
 +
}
 +
 +
#cv{
 +
background: #3a3a3a;
 +
border: 1px solid #888;
 +
position: relative;
 +
}
 +
 +
</style>
<style type="text/css">
<style type="text/css">
.CoulisseDemo
.CoulisseDemo
Line 1,069: Line 1,116:
</div>
</div>
   
   
-
<div id="DivCoverFlowFX"></div>
+
 
-
<script type="text/javascript" src="https://dl.dropboxusercontent.com/u/202315040/kaist/swfobject.js"></script>
+
<div id="container">
 +
<h1>Javascript Coverflow</h1>
 +
<canvas id="cv"></canvas>
 +
</div>
 +
<script type="text/javascript" src="coverflow.js"></script>
<script type="text/javascript">
<script type="text/javascript">
-
var flashvars = {};
+
function $(id){return document.getElementById(id)};
-
var params = {};
+
window.onload = function()
-
params.base = "";
+
{
-
params.scale = "noscale";
+
var items = [
-
params.salign = "tl";
+
{src: 'https://dl.dropboxusercontent.com/u/202315040/igem/images/1.jpg', label: {album: 'All That I Am', artist: 'Santana'}},
-
params.wmode = "transparent";
+
{src: 'https://dl.dropboxusercontent.com/u/202315040/igem/images/2.jpg', label: {album: 'August & Everything After', artist: 'Counting Crows'}},
-
params.allowFullScreen = "true";
+
{src: 'https://dl.dropboxusercontent.com/u/202315040/igem/images/3.jpg', label: {album: 'Back to Bedlam', artist: 'James Blunt'}},
-
params.allowScriptAccess = "always";
+
{src: 'https://dl.dropboxusercontent.com/u/202315040/igem/images/4.jpg', label: {album: 'Carnival of Rust', artist: 'Poets of the Fall'}},
-
swfobject.embedSWF("CoverFlowFX.swf", "DivCoverFlowFX", "600", "320", "9.0.0", false, flashvars, params);
+
 +
];
 +
for (var i = 0, j = items.length; i < items.length; i++)
 +
{
 +
var img = new Image();
 +
img.onload = function()
 +
{
 +
if (--j == 0)
 +
{
 +
Coverflow.init($('cv'), items, {
 +
onSelectCenter: function(item)
 +
{
 +
alert('Clicked: '+ item.label.album +' - '+ item.label.artist);
 +
}
 +
});
 +
}
 +
};
 +
img.src = items[i].src;
 +
}
 +
}
</script>
</script>

Revision as of 06:37, 23 August 2013

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> Team:KAIST Korea/Project Background - 2013.igem.org


Team


Javascript Coverflow




Retrieved from "http://2013.igem.org/Team:KAIST_Korea/Team"