2015-05-09 05:56:35 -04:00
|
|
|
<!doctype html>
|
|
|
|
|
<html>
|
|
|
|
|
<head>
|
|
|
|
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
|
|
|
|
|
<script src="galleria/galleria-1.4.2.min.js"></script>
|
|
|
|
|
<script src="galleria/themes/classic/galleria.classic.min.js"></script>
|
|
|
|
|
<link rel="stylesheet" href="galleria/themes/classic/galleria.classic.css">
|
|
|
|
|
<style>
|
|
|
|
|
body{ margin: 0; padding: 0; }
|
|
|
|
|
div.galleria{ width: 100%; height: 100%; background: #000; position: absolute; top: 0; bottom: 0; }
|
|
|
|
|
div.galleria-thumbnails { margin: auto;}
|
|
|
|
|
</style>
|
2015-05-09 06:17:26 -04:00
|
|
|
<title>Getting Started</title>
|
2015-05-09 05:56:35 -04:00
|
|
|
</head>
|
|
|
|
|
<body>
|
|
|
|
|
<div class="galleria">
|
2015-05-09 13:45:12 -04:00
|
|
|
|
2015-05-09 05:56:35 -04:00
|
|
|
</div>
|
|
|
|
|
<script>
|
2015-05-09 13:45:12 -04:00
|
|
|
var data = [
|
2015-05-10 14:06:04 -04:00
|
|
|
{ video: 'http://www.youtube.com/watch?v=RRq2_Pjyko8', image: 'images/rename.png', thumb: 'images/rename.thumb.png' },
|
|
|
|
|
{ video: 'http://www.youtube.com/watch?v=btNSv7AnMMw', image: 'images/episodes.png', thumb: 'images/episodes.thumb.png' },
|
|
|
|
|
{ video: 'http://www.youtube.com/watch?v=q-oZ_hovsTY', image: 'images/subtitle-hash-lookup.png', thumb: 'images/subtitle-hash-lookup.thumb.png' },
|
2015-05-09 13:45:12 -04:00
|
|
|
{ video: 'http://www.youtube.com/watch?v=R80tKtHf4zw', image: 'images/subtitle-search.png', thumb: 'images/subtitle-search.thumb.png' },
|
2015-05-10 14:06:04 -04:00
|
|
|
{ video: 'http://www.youtube.com/watch?v=4KWkSPr3fQY', image: 'images/sfv.png', thumb: 'images/sfv.thumb.png' }
|
2015-05-09 13:45:12 -04:00
|
|
|
];
|
2015-05-09 05:56:35 -04:00
|
|
|
Galleria.run('.galleria', {
|
2015-05-09 13:45:12 -04:00
|
|
|
dataSource: data,
|
2015-05-09 06:17:26 -04:00
|
|
|
maxScaleRatio: 1,
|
|
|
|
|
youtube: {
|
|
|
|
|
VQ: 'HD1080'
|
|
|
|
|
}
|
2015-05-09 05:56:35 -04:00
|
|
|
});
|
|
|
|
|
</script>
|
|
|
|
|
</body>
|
|
|
|
|
</html>
|
