Skip to content

Instantly share code, notes, and snippets.

@hectorgool
Created September 23, 2014 17:04
Show Gist options
  • Save hectorgool/02e90735f92e0dfb5d74 to your computer and use it in GitHub Desktop.
Save hectorgool/02e90735f92e0dfb5d74 to your computer and use it in GitHub Desktop.
galleria example
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>galleria.io</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
</head>
<body>
<div class="container-fluid">
<button
class="btn btn-primary"
data-toggle="modal"
data-target=".bs-example-modal-lg">
Ver imágenes
</button>
<div
class="modal fade bs-example-modal-lg"
tabindex="-1"
role="dialog"
aria-labelledby="myLargeModalLabel"
aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<!--Contenido-->
<div id="galleria" style="height: 500px;">
</div>
</div>
</div>
</div>
</div>
<script src="http://code.jquery.com/jquery.min.js"></script>
<script src="galleria/galleria-1.4.2.min.js"></script>
<script src="galleria/plugins/flickr/galleria.flickr.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<script>
$(document).ready(function(){
Galleria.loadTheme('galleria/themes/classic/galleria.classic.min.js');
//Galleria.run('#galleria');
Galleria.run('#galleria', { flickr: 'search:beach' });
//http://support.galleria.io/discussions/questions/283-keyboard-navigation
Galleria.ready(function() {
this.attachKeyboard({
right: this.next,
left: this.prev
});
});
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment