HandBrake/HandBrake-docs
1
0
Fork 0
mirror of https://github.com/HandBrake/HandBrake-docs.git synced 2025-12-10 00:44:52 -06:00
Code Issues Packages Projects Releases 1 Wiki Activity

templates: Improve lightbox script to handle images with srcset attribute.

Browse Source
This commit is contained in:
Bradley Sepos 2018-01-26 23:17:33 -05:00
parent d98160a2a0
commit 27285e8760
No known key found for this signature in database
GPG Key ID: DEADE2F57D42D9C7
2 changed files with 34 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
templates/mark1/assets/js/scripts.js
View File

@ -161,5 +161,37 @@ $(document).ready(function(){
$('article.docs nav .breadcrumbs .language-separator').add('article.docs nav .breadcrumbs .language').css('display', 'inline');
}
docs.find('figure > a:has(img)').featherlight({type: 'image', openSpeed: 150, closeSpeed: 150});
$.featherlight.defaults.onResize = function(){
$(this.$content[0]).css('max-width', this.$content[0].naturalWidth);
$(this.$content[0]).css('max-height', this.$content[0].naturalHeight);
};
$.featherlight.contentFilters.image2 = {
regex: /\.(png|jpg|jpeg|gif|tiff?|bmp|svg)(\?\S*)?$/i,
process: function(url){
var self = this,
deferred = $.Deferred(),
img = new Image(),
$img = $('<img src="'+url+'" alt="" class="'+self.namespace+'-image" />');
var srcset = $(this.$currentTarget[0]).attr('data-srcset');
if (srcset.length > 0) {
$img = $('<img src="'+url+'" srcset="'+srcset+'" alt="" class="'+self.namespace+'-image" />');
};
img.onload = function() {
/* Store naturalWidth & height for IE8 */
$img.naturalWidth = img.width; $img.naturalHeight = img.height;
deferred.resolve( $img );
};
img.onerror = function() { deferred.reject($img); };
img.src = url;
return deferred.promise();
}
};
$.featherlight.defaults.contentFilters.unshift('image2');
docs.find('figure > a:has(img)').each(function(){
var srcset = $(this).children('img').first().attr('srcset');
if (srcset.length > 0){
$(this).attr('data-srcset', srcset);
}
$(this).featherlight({type: 'image2', openSpeed: 150, closeSpeed: 150});
});
});

2
templates/mark1/template.yaml
View File

@ -33,5 +33,5 @@ Template:
- assets/js/vendor/jquery/jquery-3.3.1.min.js
- assets/js/vendor/js-cookie/js-cookie-2.1.1.min.js
- assets/js/vendor/featherlight/featherlight-1.7.12.min.js
- assets/js/scripts.js?2016111901
- assets/js/scripts.js?2018012601
...