-
Notifications
You must be signed in to change notification settings - Fork 2
/
Copy pathindex.html
192 lines (165 loc) · 14 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
<!DOCTYPE html>
<html lang="en">
<head>
<title>Galleria – Responsive JavaScript Image Gallery</title>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=Edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="shortcut icon" href="_static/favicon.ico">
<link rel="stylesheet" href="_static/style.min.css" type='text/css' media="all" />
<script src="_static/jquery.js"></script>
<script src="_static/galleria.min.js"></script>
<script type="text/javascript" id="documentation_options" data-url_root="./" src="_static/documentation_options.js"></script>
<script type="text/javascript" src="_static/underscore.js" defer></script>
<script type="text/javascript" src="_static/doctools.js" defer></script>
<script type="text/javascript" src="_static/language_data.js" defer></script>
</head>
<body class="demo home">
<nav class="navbar is-transparent" role="navigation" aria-label="main navigation">
<div class="container">
<div class="navbar-brand">
<a class="navbar-item" href="/">
Galleria
</a>
<a role="button" class="navbar-burger burger" aria-label="menu" aria-expanded="false" data-target="navMenu">
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
</a>
</div>
<div class="navbar-menu" id="navMenu">
<div class="navbar-end">
<a class="navbar-item" href="download">
Download
</a>
<a class="navbar-item" href="themes">
Themes
</a>
<a class="navbar-item" href="docs">
Documentation
</a>
</div>
</div>
</div>
</nav>
<svg aria-hidden="true" style="position: absolute; width: 0; height: 0; overflow: hidden;" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<defs>
<symbol id="icon-mobile" viewBox="0 0 32 32">
<title>mobile</title>
<path d="M1.5 32h14c0.276 0 0.5-0.224 0.5-0.5s-0.224-0.5-0.5-0.5h-14c-0.276 0-0.5-0.224-0.5-0.5v-29c0-0.276 0.224-0.5 0.5-0.5h21c0.276 0 0.5 0.224 0.5 0.5v5c0 0.276 0.224 0.5 0.5 0.5s0.5-0.224 0.5-0.5v-5c0-0.827-0.673-1.5-1.5-1.5h-21c-0.827 0-1.5 0.673-1.5 1.5v29c0 0.827 0.673 1.5 1.5 1.5zM18 10.5v20c0 0.827 0.673 1.5 1.5 1.5h11c0.827 0 1.5-0.673 1.5-1.5v-20c0-0.827-0.673-1.5-1.5-1.5h-11c-0.827 0-1.5 0.673-1.5 1.5zM31 10.5v20c0 0.276-0.224 0.5-0.5 0.5h-11c-0.276 0-0.5-0.224-0.5-0.5v-20c0-0.276 0.224-0.5 0.5-0.5h11c0.276 0 0.5 0.224 0.5 0.5zM11 28c0 0.552 0.448 1 1 1s1-0.448 1-1c0-0.552-0.448-1-1-1s-1 0.448-1 1zM24 28c0 0.552 0.448 1 1 1s1-0.448 1-1c0-0.552-0.448-1-1-1s-1 0.448-1 1z"></path>
</symbol>
<symbol id="icon-phone" viewBox="0 0 19 32">
<title>phone</title>
<path d="M1.5 32h16c0.827 0 1.5-0.673 1.5-1.5v-29c0-0.827-0.673-1.5-1.5-1.5h-16c-0.827 0-1.5 0.673-1.5 1.5v29c0 0.827 0.673 1.5 1.5 1.5zM1 1.5c0-0.276 0.224-0.5 0.5-0.5h16c0.276 0 0.5 0.224 0.5 0.5v29c0 0.276-0.224 0.5-0.5 0.5h-16c-0.276 0-0.5-0.224-0.5-0.5v-29zM2.5 27h14c0.276 0 0.5-0.224 0.5-0.5v-21c0-0.276-0.224-0.5-0.5-0.5h-14c-0.276 0-0.5 0.224-0.5 0.5v21c0 0.276 0.224 0.5 0.5 0.5zM3 6h13v20h-13v-20zM9 29c0 0.552 0.448 1 1 1s1-0.448 1-1c0-0.552-0.448-1-1-1s-1 0.448-1 1zM7.5 4h4c0.276 0 0.5-0.224 0.5-0.5s-0.224-0.5-0.5-0.5h-4c-0.276 0-0.5 0.224-0.5 0.5s0.224 0.5 0.5 0.5z"></path>
</symbol>
<symbol id="icon-video" viewBox="0 0 37 32">
<title>video</title>
<path d="M7.5 0h-6c-0.869 0-1.5 0.631-1.5 1.5v29c0 0.869 0.631 1.5 1.5 1.5h34c0.869 0 1.5-0.631 1.5-1.5v-29c0-0.869-0.631-1.5-1.5-1.5h-28zM1 30.5v-29c0-0.313 0.187-0.5 0.5-0.5h5.5v30h-5.5c-0.313 0-0.5-0.187-0.5-0.5zM8 31v-30h21v30h-21zM36 1.5v29c0 0.313-0.187 0.5-0.5 0.5h-5.5v-30h5.5c0.313 0 0.5 0.187 0.5 0.5zM14.777 10.084c-0.153-0.102-0.351-0.112-0.514-0.025-0.161 0.087-0.263 0.256-0.263 0.441v12c0 0.185 0.102 0.354 0.264 0.441 0.074 0.039 0.155 0.059 0.236 0.059 0.097 0 0.193-0.028 0.277-0.084l9-6c0.139-0.093 0.223-0.249 0.223-0.416s-0.084-0.323-0.223-0.416l-9-6zM15 21.566v-10.132l7.599 5.066-7.599 5.066zM5 8h-2c-0.276 0-0.5 0.224-0.5 0.5s0.224 0.5 0.5 0.5h2c0.276 0 0.5-0.224 0.5-0.5s-0.224-0.5-0.5-0.5zM3 5h2c0.276 0 0.5-0.224 0.5-0.5s-0.224-0.5-0.5-0.5h-2c-0.276 0-0.5 0.224-0.5 0.5s0.224 0.5 0.5 0.5zM5 12h-2c-0.276 0-0.5 0.224-0.5 0.5s0.224 0.5 0.5 0.5h2c0.276 0 0.5-0.224 0.5-0.5s-0.224-0.5-0.5-0.5zM5 16h-2c-0.276 0-0.5 0.224-0.5 0.5s0.224 0.5 0.5 0.5h2c0.276 0 0.5-0.224 0.5-0.5s-0.224-0.5-0.5-0.5zM5 20h-2c-0.276 0-0.5 0.224-0.5 0.5s0.224 0.5 0.5 0.5h2c0.276 0 0.5-0.224 0.5-0.5s-0.224-0.5-0.5-0.5zM5 24h-2c-0.276 0-0.5 0.224-0.5 0.5s0.224 0.5 0.5 0.5h2c0.276 0 0.5-0.224 0.5-0.5s-0.224-0.5-0.5-0.5zM5 28h-2c-0.276 0-0.5 0.224-0.5 0.5s0.224 0.5 0.5 0.5h2c0.276 0 0.5-0.224 0.5-0.5s-0.224-0.5-0.5-0.5zM32 9h2c0.276 0 0.5-0.224 0.5-0.5s-0.224-0.5-0.5-0.5h-2c-0.276 0-0.5 0.224-0.5 0.5s0.224 0.5 0.5 0.5zM32 5h2c0.276 0 0.5-0.224 0.5-0.5s-0.224-0.5-0.5-0.5h-2c-0.276 0-0.5 0.224-0.5 0.5s0.224 0.5 0.5 0.5zM32 13h2c0.276 0 0.5-0.224 0.5-0.5s-0.224-0.5-0.5-0.5h-2c-0.276 0-0.5 0.224-0.5 0.5s0.224 0.5 0.5 0.5zM32 17h2c0.276 0 0.5-0.224 0.5-0.5s-0.224-0.5-0.5-0.5h-2c-0.276 0-0.5 0.224-0.5 0.5s0.224 0.5 0.5 0.5zM32 21h2c0.276 0 0.5-0.224 0.5-0.5s-0.224-0.5-0.5-0.5h-2c-0.276 0-0.5 0.224-0.5 0.5s0.224 0.5 0.5 0.5zM32 25h2c0.276 0 0.5-0.224 0.5-0.5s-0.224-0.5-0.5-0.5h-2c-0.276 0-0.5 0.224-0.5 0.5s0.224 0.5 0.5 0.5zM34 28h-2c-0.276 0-0.5 0.224-0.5 0.5s0.224 0.5 0.5 0.5h2c0.276 0 0.5-0.224 0.5-0.5s-0.224-0.5-0.5-0.5z"></path>
</symbol>
<symbol id="icon-key" viewBox="0 0 32 32">
<title>key</title>
<path d="M14.683 14.698c0.117 0 0.235-0.041 0.33-0.124l11.317-9.922-0.66-0.752-11.317 9.921c-0.208 0.182-0.229 0.498-0.046 0.706 0.099 0.113 0.237 0.171 0.376 0.171zM10.188 32c6.142 0 9.812-4.83 9.812-9.5 0-1.346-0.322-2.829-0.798-3.792l4.522-2.261c0.169-0.085 0.276-0.258 0.276-0.447v-4h3c0.011 0 0.102-0.006 0.113-0.006 0.666-0.045 0.865-0.257 0.887-0.994v-4h3c0.129 0 0.218 0.014 0.278 0.023 0.121 0.019 0.347 0.054 0.543-0.122 0.202-0.18 0.193-0.408 0.185-0.609-0.002-0.072-0.006-0.167-0.006-0.292v-4.531c0-0.81-0.659-1.469-1.469-1.469h-3.875c-0.354 0-0.698 0.129-0.969 0.364l-13.187 11.56c-0.649-0.13-1.63-0.299-2.313-0.299-5.617 0-10.187 4.57-10.187 10.187s4.57 10.188 10.188 10.188zM10.188 12.625c0.501 0 1.359 0.12 2.354 0.328 0.155 0.034 0.314-0.010 0.432-0.113l13.371-11.722c0.087-0.076 0.198-0.118 0.311-0.118h3.875c0.259 0 0.469 0.21 0.469 0.469v4.531h-3.5c-0.276 0-0.5 0.224-0.5 0.5v4.5h-3.5c-0.276 0-0.5 0.224-0.5 0.5v4.191l-4.724 2.362c-0.131 0.065-0.227 0.186-0.262 0.328s-0.006 0.293 0.080 0.412c0.44 0.607 0.906 2.114 0.906 3.707 0 4.178-3.296 8.5-8.812 8.5-5.066 0-9.188-4.122-9.188-9.188s4.122-9.187 9.188-9.187zM8.5 27c1.93 0 3.5-1.57 3.5-3.5s-1.57-3.5-3.5-3.5-3.5 1.57-3.5 3.5 1.57 3.5 3.5 3.5zM8.5 21c1.378 0 2.5 1.122 2.5 2.5s-1.122 2.5-2.5 2.5-2.5-1.122-2.5-2.5 1.122-2.5 2.5-2.5z"></path>
</symbol>
<symbol id="icon-lightbulb" viewBox="0 0 22 32">
<title>lightbulb</title>
<path d="M11 0c-5.29 0-11 4.206-11 11 0 3.353 1.334 6.174 3.896 8.312 0.027 0.034 0.058 0.063 0.092 0.088 1.901 2.062 1.997 2.454 2.010 3.361 0.006 0.359 0.003 0.465 0 0.523l-0.004 0.209c-0.015 0.452-0.038 1.209 0.899 1.495l8.094 1.781c0.036 0.008 0.072 0.012 0.107 0.012 0.23 0 0.437-0.159 0.488-0.393 0.060-0.27-0.111-0.537-0.381-0.596l-8.055-1.771c-0.155-0.047-0.168-0.051-0.154-0.498l0.003-0.191c0 0 0.010-0.078 0.002-0.586-0.019-1.269-0.295-1.882-2.309-4.059-0.039-0.048-0.086-0.088-0.138-0.118-2.356-2.003-3.55-4.549-3.55-7.569 0-6.177 5.19-10 10-10 4.916 0 10 3.741 10 10 0 3.978-1.928 6.171-3.518 7.551-0.055 0.026-0.104 0.063-0.147 0.109-2.037 2.204-2.313 2.817-2.332 4.086 0 0.030-0.001 0.065 0 0.103l-0.001 0.035c-0.003 0.076-0.014 0.118-0.013 0.134-0.034-0.005-0.117-0.018-0.117-0.018l-4.195-0.987c-0.272-0.062-0.538 0.104-0.601 0.372s0.103 0.538 0.372 0.602l4.144 0.972c0.055 0.020 0.553 0.182 0.973-0.113 0.183-0.129 0.396-0.382 0.434-0.866l0.003-0.047c0.001-0.032 0.002-0.065 0.002-0.099 0-0.009 0-0.018-0.001-0.026l0.001-0.046c0.013-0.902 0.107-1.294 2.005-3.356 0.009-0.007 0.019-0.014 0.027-0.022 2.667-2.241 3.964-4.984 3.964-8.384 0-6.885-5.593-11-11-11zM15 29.5c0.229 0 0.435-0.157 0.487-0.39 0.062-0.269-0.107-0.537-0.377-0.598l-8-1.814c-0.271-0.060-0.537 0.108-0.598 0.377-0.062 0.269 0.107 0.537 0.377 0.598l8 1.814c0.038 0.009 0.075 0.013 0.111 0.013zM7.609 29.554c-0.271-0.060-0.536 0.109-0.598 0.378-0.060 0.27 0.109 0.537 0.379 0.597l6.5 1.458c0.038 0.009 0.074 0.013 0.11 0.013 0.229 0 0.436-0.158 0.488-0.391 0.060-0.27-0.109-0.537-0.379-0.597l-6.5-1.458z"></path>
</symbol>
<symbol id="icon-paintbrush" viewBox="0 0 22 32">
<title>paintbrush</title>
<path d="M15.403 21h4.58c1.053 0 1.909-0.856 2.017-1.909v-17.182c-0.108-1.053-0.964-1.909-2.017-1.909h-17.966c-1.053 0-1.909 0.856-2.017 1.909v17.182c0.108 1.053 0.964 1.909 2.017 1.909h4.962c0.348 0 2.083 0.074 2.083 1.542 0 2.622-0.553 3.842-0.762 4.302l-0.049 0.109 0.403 0.174v0.013l-0.447-0.090c-0.017 0.033-0.030 0.068-0.038 0.104-0.154 0.411-0.232 0.833-0.232 1.257 0.001 2.147 1.231 3.589 3.063 3.589 1.851 0 3.094-1.442 3.094-3.589 0-0.391-0.066-0.78-0.198-1.161-0.005-0.114-0.049-0.22-0.119-0.302-0.026-0.060-0.060-0.125-0.101-0.202-0.219-0.415-0.676-1.277-0.676-4.204 0-0.62 0.64-1.542 2.403-1.542zM1 12.059h20v3.941h-20v-3.941zM2.017 1h17.966c0.501 0 0.909 0.408 1.017 0.909v9.149h-20v-9.149c0.108-0.501 0.516-0.909 1.017-0.909zM12.792 27.214c0.028 0.053 0.052 0.097 0.093 0.189 0 0.001 0.003 0.007 0.007 0.016 0.004 0.013 0.008 0.025 0.013 0.038 0.125 0.313 0.188 0.635 0.188 0.954 0.001 1.252-0.549 2.589-2.093 2.589-1.521 0-2.062-1.337-2.062-2.589 0-0.319 0.063-0.641 0.188-0.954 0.004-0.012 0.009-0.023 0.012-0.035 0.014-0.030 0.031-0.068 0.033-0.072l0.042-0.093c0.232-0.514 0.851-1.876 0.851-4.715-0.002-2.007-1.939-2.542-3.114-2.542 0 0 0 0-0.001 0h-4.932c-0.501 0-0.909-0.408-1.017-0.909v-2.091h20v2.091c-0.108 0.501-0.516 0.909-1.017 0.909h-4.58c-2.497 0-3.403 1.521-3.403 2.542 0 3.175 0.535 4.187 0.792 4.672z"></path>
</symbol>
</defs>
</svg>
<section class="hero">
<div class="hero-body">
<div class="container has-text-centered">
<p class="heroIntro">A free JavaScript image gallery framework that simplifies the process <br/> of creating beautiful image galleries for the web and mobile devices.</p>
</div>
</div>
</section>
<section class="section HomeGalleria">
<div class="container center-block">
<div class="center-block" id="demo"></div>
</div>
</section>
<section class="section Benefits">
<div class="container">
<div class="columns is-variable is-8">
<div class="column">
<span><svg class="icon icon-key"><use xlink:href="#icon-key"></use></svg></span>
<h5>Free without restrictions</h5>
<p>Galleria and all included themes are open source and released under the MIT license with basically no restrictions whatsoever.</p>
</div>
<div class="column">
<span><svg class="icon icon-lightbulb"><use xlink:href="#icon-lightbulb"></use></svg></span>
<h5>No programming skills required</h5>
<p>Just copy/paste a few lines of code, add some photos or videos and pop a fully featured gallery in your browser.</p>
</div>
<div class="column">
<span><svg class="icon icon-video"><use xlink:href="#icon-video"></use></svg></span>
<h5>Flickr, Vimeo, YouTube & more</h5>
<p>Pull galleries, sets and movies from several sources into a Galleria gallery with just a few lines of code.</p>
</div>
</div>
<div class="columns is-variable is-8">
<div class="column">
<span><svg class="icon icon-mobile"><use xlink:href="#icon-mobile"></use></svg></span>
<h5>100% Responsive</h5>
<p>Galleria is optimized for responsive environments and also comes with srcset/sizes support to deliver the best quality image for retina/high DPI Displays.</p>
</div>
<div class="column">
<span><svg class="icon icon-phone"><use xlink:href="#icon-phone"></use></svg></span>
<h5>iPhone, iPad & touch support</h5>
<p>Galleria supports native-like swipe movements and uses hardware optimized animations for ultra-smooth image browsing on mobile and touch devices.</p>
</div>
<div class="column">
<span><svg class="icon icon-paintbrush"><use xlink:href="#icon-paintbrush"></use></svg></span>
<h5>One core, multiple themes</h5>
<p>Galleria exposes a great set of tools to create tailored themes for your project. Or you can browse through the <a href="themes"> themes</a> and see if something fits.</p>
</div>
</div>
</div>
</section>
<section class="cta">
<div class="container has-text-centered">
<h1 class="title is-spaced">
Ready to put Galleria on your Website?
</h1>
<h2 class="subtitle">
Download Galleria for free!
</h2>
<a href="download" class="button button-huge is-link is-large">Get started</a>
</div>
</section>
<footer class="footer">
<div class="content has-text-centered">
<ul class="footer-menu">
<li><a href="download">Download</a></li>
<li><a href="themes">Themes</a></li>
<li><a href="docs">Documentation</a></li>
<li><a href="https://github.com/galleriajs/galleria">Github</a></li>
</ul>
</div>
</footer>
<script src="_static/main.min.js"></script>
<script src="_static/themes/twelve/galleria.twelve.min.js"></script>
<script>
$(function() {
$.ajax({
url: "_static/data.json",
type: 'GET',
dataType: 'json',
success: function(data) {
Galleria.run('#demo', {
autoplay: true,
responsive: true,
height: 0.5,
dataSource: data,
maxVideoSize: 1300
});
}
});
});
</script>
</body>
</html>