This repository has been archived by the owner on Jan 20, 2021. It is now read-only.
/
index.html
67 lines (66 loc) · 2.98 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
<!DOCTYPE HTML>
<!--
/*
* Photobox
* Copyright 2012, Yair Even Or
* https://github.com/yairEO/photobox
*/
-->
<html lang="en">
<head>
<!--[if IE]><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"><![endif]-->
<meta charset="utf-8">
<title>Photobox - CSS3 image gallery modal viewer</title>
<meta name="description" content="A lightweight CSS3 image gallery that is pretty to look and and easy to use">
<meta name="viewport" content="width=device-width">
<link rel="shortcut icon" href="favicon.ico"/>
<link rel="stylesheet" href="demo/styles.css">
<link rel="stylesheet" href="photobox/photobox.css">
<!--[if lt IE 9]><script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
<script src="//ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src='photobox/jquery.photobox.js'></script>
</head>
<body>
<div id='wrap'>
<div class='main'>
<h1>Photobox</h1>
<h2>CSS3 image gallery jQuery plugin</h2>
<p>A lightweight image gallery modal window script which uses only CSS3 for silky-smooth animations and transitions,
utilizes GPU rending, which can be completely controlled and themed directly from the CSS.</p>
<ul>
<li>Lightweight! <code>jquery.photobox.js</code> is only 5kb (gziped & minified)</li>
<li>Hardware accelerated, CSS3 transitions and animations</li>
<li>Mobile friendly</li>
<li>Support videos via iframe embedding</li>
<li>Stunning UI and user-friendly UX</li>
<li>Images & videos can be zoomed using mousewheel</li>
<li>Thumbnails can be zoomed using mousewheel</li>
<li>Keyboard & mouse navigation. Even using mousewheel left/right ;-)</li>
<li>Exposed UX control up to 99%. No need to mess with the source code</li>
<li>Observes DOM changes (if images were added/removed)</li>
<li>Event-delegation on all thumbnails events (obviously...)</li>
<li>HTML5 History support: update location with the currently viewed image</li>
<li>No images at all! The only image is a pre-loader animation for old IE.</li>
<li>Browsers support: IE8+ (graceful degradation), Modern browsers</li>
<li>And more...</li>
</ul>
<p>Supports: <strong>Firefox</strong>, <strong>Chrome</strong> and <strong>IE8+</strong></p>
<p>(This plugin has <u>nothing</u> to do with Flickr)</p>
<a href='https://github.com/yairEO/photobox' class='btn'>Github project page</a>
<footer>By Yair Even Or <span class='copy'>©</span> 2012</footer>
</div>
<ul id='gallery'></ul>
</div>
<script src='demo/demo.js'></script>
<script>
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-26520680-1']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
</body>
</html>