mirror of
https://github.com/next-theme/hexo-theme-next.git
synced 2026-01-20 19:02:33 +00:00
Upgrade to fancybox 5 (#677)
This commit is contained in:
parent
8fd8f9247c
commit
8b8632f137
25
_vendors.yml
25
_vendors.yml
@ -53,23 +53,18 @@ pjax:
|
|||||||
file: pjax.min.js
|
file: pjax.min.js
|
||||||
alias: next-theme-pjax
|
alias: next-theme-pjax
|
||||||
integrity: sha256-vxLn1tSKWD4dqbMRyv940UYw4sXgMtYcK6reefzZrao=
|
integrity: sha256-vxLn1tSKWD4dqbMRyv940UYw4sXgMtYcK6reefzZrao=
|
||||||
jquery:
|
|
||||||
name: jquery
|
|
||||||
version: 3.7.0
|
|
||||||
file: dist/jquery.min.js
|
|
||||||
integrity: sha256-2Pmvv0kuTBOenSvLm6bvfBSSHrUJ+3A7x6P5Ebd07/g=
|
|
||||||
fancybox_js:
|
fancybox_js:
|
||||||
name: '@fancyapps/fancybox'
|
name: '@fancyapps/ui'
|
||||||
version: 3.5.7
|
version: 5.0.20
|
||||||
file: dist/jquery.fancybox.min.js
|
file: dist/fancybox/fancybox.umd.js
|
||||||
alias: fancybox
|
alias: fancyapps-ui
|
||||||
integrity: sha256-yt2kYMy0w8AbtF89WXb2P1rfjcP/HTHLT7097U8Y5b8=
|
integrity: sha256-q8XkJ6dj5VwSvzI8+nATCHHQG+Xv/dAZBCgqmu93zOY=
|
||||||
fancybox_css:
|
fancybox_css:
|
||||||
name: '@fancyapps/fancybox'
|
name: '@fancyapps/ui'
|
||||||
version: 3.5.7
|
version: 5.0.20
|
||||||
file: dist/jquery.fancybox.min.css
|
file: dist/fancybox/fancybox.css
|
||||||
alias: fancybox
|
alias: fancyapps-ui
|
||||||
integrity: sha256-Vzbj7sDDS/woiFS3uNKo8eIuni59rjyNGtXfstRzStA=
|
integrity: sha256-RvRHGSuWAxZpXKV9lLDt2e+rZ+btzn48Wp4ueS3NZKs=
|
||||||
mediumzoom:
|
mediumzoom:
|
||||||
name: medium-zoom
|
name: medium-zoom
|
||||||
version: 1.0.8
|
version: 1.0.8
|
||||||
|
|||||||
@ -15,7 +15,7 @@ hexo.extend.helper.register('js_vendors', function() {
|
|||||||
vendors.push('pjax');
|
vendors.push('pjax');
|
||||||
}
|
}
|
||||||
if (theme.fancybox) {
|
if (theme.fancybox) {
|
||||||
vendors.push('jquery', 'fancybox_js');
|
vendors.push('fancybox_js');
|
||||||
}
|
}
|
||||||
if (theme.mediumzoom) {
|
if (theme.mediumzoom) {
|
||||||
vendors.push('mediumzoom');
|
vendors.push('mediumzoom');
|
||||||
|
|||||||
@ -45,8 +45,8 @@
|
|||||||
margin-left: 4px;
|
margin-left: 4px;
|
||||||
}
|
}
|
||||||
|
|
||||||
// For fancybox and pandoc
|
// https://github.com/hexojs/hexo-renderer-marked/pull/264
|
||||||
.image-caption, img + figcaption, .fancybox + figcaption {
|
img + figcaption, .fancybox + figcaption {
|
||||||
color: $grey-dark;
|
color: $grey-dark;
|
||||||
font-size: $font-size-small;
|
font-size: $font-size-small;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
|
|||||||
@ -53,7 +53,7 @@ if (hexo-config('mobile_layout_economy')) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
// Fix issue #641
|
// Fix issue #641
|
||||||
.image-caption, img + figcaption, .fancybox + figcaption {
|
img + figcaption, .fancybox + figcaption {
|
||||||
margin: -5px auto 15px !important;
|
margin: -5px auto 15px !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
51
source/js/third-party/fancybox.js
vendored
51
source/js/third-party/fancybox.js
vendored
@ -1,38 +1,35 @@
|
|||||||
|
/* global Fancybox */
|
||||||
|
|
||||||
document.addEventListener('page:loaded', () => {
|
document.addEventListener('page:loaded', () => {
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Wrap images with fancybox.
|
* Wrap images with fancybox.
|
||||||
*/
|
*/
|
||||||
document.querySelectorAll('.post-body :not(a) > img, .post-body > img').forEach(element => {
|
document.querySelectorAll('.post-body :not(a) > img, .post-body > img').forEach(image => {
|
||||||
const $image = $(element);
|
const imageLink = image.dataset.src || image.src;
|
||||||
const imageLink = $image.attr('data-src') || $image.attr('src');
|
const imageWrapLink = document.createElement('a');
|
||||||
const $imageWrapLink = $image.wrap(`<a class="fancybox fancybox.image" href="${imageLink}" itemscope itemtype="http://schema.org/ImageObject" itemprop="url"></a>`).parent('a');
|
imageWrapLink.classList.add('fancybox');
|
||||||
if ($image.is('.post-gallery img')) {
|
imageWrapLink.href = imageLink;
|
||||||
$imageWrapLink.attr('data-fancybox', 'gallery').attr('rel', 'gallery');
|
imageWrapLink.setAttribute('itemscope', '');
|
||||||
} else if ($image.is('.group-picture img')) {
|
imageWrapLink.setAttribute('itemtype', 'http://schema.org/ImageObject');
|
||||||
$imageWrapLink.attr('data-fancybox', 'group').attr('rel', 'group');
|
imageWrapLink.setAttribute('itemprop', 'url');
|
||||||
} else {
|
|
||||||
$imageWrapLink.attr('data-fancybox', 'default').attr('rel', 'default');
|
|
||||||
}
|
|
||||||
|
|
||||||
const imageTitle = $image.attr('title') || $image.attr('alt');
|
let dataFancybox = 'default';
|
||||||
|
if (image.closest('.post-gallery') !== null) {
|
||||||
|
dataFancybox = 'gallery';
|
||||||
|
} else if (image.closest('.group-picture') !== null) {
|
||||||
|
dataFancybox = 'group';
|
||||||
|
}
|
||||||
|
imageWrapLink.dataset.fancybox = dataFancybox;
|
||||||
|
|
||||||
|
const imageTitle = image.title || image.alt;
|
||||||
if (imageTitle) {
|
if (imageTitle) {
|
||||||
// Do not append image-caption if pandoc has already created a figcaption
|
imageWrapLink.title = imageTitle;
|
||||||
if (!$imageWrapLink.next('figcaption').length) {
|
// Make sure img captions will show correctly in fancybox
|
||||||
$imageWrapLink.append(`<p class="image-caption">${imageTitle}</p>`);
|
imageWrapLink.dataset.caption = imageTitle;
|
||||||
}
|
|
||||||
// Make sure img title tag will show correctly in fancybox
|
|
||||||
$imageWrapLink.attr('title', imageTitle).attr('data-caption', imageTitle);
|
|
||||||
}
|
}
|
||||||
|
image.wrap(imageWrapLink);
|
||||||
});
|
});
|
||||||
|
|
||||||
$.fancybox.defaults.hash = false;
|
Fancybox.bind('[data-fancybox]');
|
||||||
$('.fancybox').fancybox({
|
|
||||||
loop : true,
|
|
||||||
helpers: {
|
|
||||||
overlay: {
|
|
||||||
locked: false
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
});
|
});
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user