Compare commits

...

3 Commits

Author SHA1 Message Date
Kam dev 4ba2708668 dev 2024-07-04 17:39:43 +00:00
Kam dev 72b04fe8d6 fix broken lazy load 2024-07-04 16:45:18 +00:00
Kam dev 288f4e8d15 update jquery.lazy 2024-07-04 16:16:06 +00:00
5 changed files with 4647 additions and 31 deletions

View File

@ -1,5 +1,3 @@
<!--
<script src="/assets/gallery.js"></script> <script src="/assets/gallery.js"></script>
-->
</body> </body>
</html> </html>

View File

@ -12,17 +12,18 @@
maximum-scale=1"> maximum-scale=1">
<link href='//fonts.googleapis.com/css?family=Roboto:400,900' rel='stylesheet' type='text/css'> <link href='//fonts.googleapis.com/css?family=Roboto:400,900' rel='stylesheet' type='text/css'>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/jquery.lazy/1.7.4/jquery.lazy.min.js"></script> <script type="text/javascript" src="//code.jquery.com/jquery-3.7.1.min.js"></script>
<script type="text/javascript" src="//cdn.jsdelivr.net/jquery.lazy/1.7.9/jquery.lazy.min.js"></script>
<link rel="stylesheet" href="/assets/gallery.css"> <link rel="stylesheet" href="/assets/gallery.css">
</head> </head>
<body> <body>
<script type="text/javascript"> <script type="text/javascript">
$(function() { (function() {
$('.lazy').lazy({ $('.lazy').lazy({
effect: "fadeIn", effect: "fadeIn",
effectTime: 2000, effectTime: 1000,
threshold: 0 threshold: 500
}); });
}); });
</script> </script>

View File

@ -30,17 +30,17 @@
<div id="gallery"> <div id="gallery">
{% for image in sorted_imgs %} {% for image in sorted_imgs %}
<div class="picture-frame"> <div class="picture-frame">
<a class="item lazy" href="{{ image[0] }}"> <a class="item" href="{{ image[0] }}">
<img <img
src="thumbs/{{ image[0] }}" src="thumbs/{{ image[0] }}"
data-src="thumbs/{{ image[0] }}" data-src="thumbs/{{ image[0] }}"
height="300" /> />
</a> </a>
{% assign image_path = '/usr/local/jekyll/sites/photos.kameronkenny.com/photos/' | append: page.gallery | append: '/' | append: image[0] %} {% assign image_path = '/usr/local/jekyll/sites/photos.kameronkenny.com/photos/' | append: page.gallery | append: '/' | append: image[0] %}
{% capture has_exif %}{{ image_path | exif: "exif?" }}{% endcapture %} {% capture has_exif %}{{ image_path | exif: "exif?" }}{% endcapture %}
{% if has_exif %} {% if has_exif %}
<p>{{ image_path | exif: 'model' }} {{ image_path | exif: 'shutter_speed_value'}}</p> <div class="meta"><div class="pull-left">{{ image_path | exif: 'model' }}</div> <div class="pull-right">{{ image_path | exif: 'shutter_speed_value'}}</div></div>
<p>{{ image_path | exif: 'lens_model' }} f{{ image_path | exif: 'aperture_value' }}</p> <div class="meta"><div class="pull-left">{{ image_path | exif: 'lens_model' }}</div> <div class="pull-right">f/{{ image_path | exif: 'aperture_value' }}</div></div>
{% endif %} {% endif %}
</div> </div>
{% endfor %} {% endfor %}

View File

@ -2252,12 +2252,14 @@ a {
overflow: hidden; overflow: hidden;
position: relative; } position: relative; }
#gallery .item { #gallery .item {
float: left; } float: left;
margin-bottom: 5px;
}
#gallery .item a {
}
#gallery .item.last-row, #gallery .item.last-row ~ a { #gallery .item.last-row, #gallery .item.last-row ~ a {
margin-bottom: 0; } margin-bottom: 0; }
#gallery .item img { #gallery .item img {
width: 100%;
height: 100%;
background: rgba(255, 255, 255, 0.02); background: rgba(255, 255, 255, 0.02);
opacity: 0.9; } opacity: 0.9; }
#gallery .item:hover img { #gallery .item:hover img {
@ -2267,9 +2269,15 @@ a {
overflow: hidden; overflow: hidden;
position: relative; position: relative;
float: left; float: left;
padding: 0px; padding: 5px;
padding-bottom: 50px;
background: rgba(0,0,0, 0.5); background: rgba(0,0,0, 0.5);
color: white; color: white;
font-size: 12px; font-size: 12px;
} }
.meta {
overflow: hidden;
position: relative;
padding: 5px;
background: rgba(0,0,0, 0.5);
}

File diff suppressed because one or more lines are too long