diff --git a/_config.yml b/_config.yml index 68f014e..a647002 100755 --- a/_config.yml +++ b/_config.yml @@ -193,6 +193,9 @@ tag_plugins: qq: https://cdn.jsdelivr.net/gh/volantis-x/cdn-emoji/qq/%s.gif aru: https://cdn.jsdelivr.net/gh/volantis-x/cdn-emoji/aru-l/%s.gif tieba: https://cdn.jsdelivr.net/gh/volantis-x/cdn-emoji/tieba/%s.png + # {% image %} + image: + fancybox: # true, false ######## JS Plugins ######## @@ -201,11 +204,6 @@ plugins: # jquery jquery: https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.min.js - # swiper - swiper: - enable: true - css: https://unpkg.com/swiper@6/swiper-bundle.min.css - js: https://unpkg.com/swiper@6/swiper-bundle.min.js # issues api sitesjs: /js/plugins/sites.js friendsjs: /js/plugins/friends.js @@ -233,17 +231,23 @@ plugins: duration: 500 # ms interval: 100 # ms scale: 1 # 0.1~1 - + # https://fancyapps.com/docs/ui/fancybox/ + # available for {% image xxx %} fancybox: - enable: #true + enable: true js: https://cdn.jsdelivr.net/npm/@fancyapps/ui@4.0/dist/fancybox.umd.js css: https://cdn.jsdelivr.net/npm/@fancyapps/ui@4.0/dist/fancybox.css - comment: - enable: #true # 是否处理评论区的图片,注意:不支持 iframe 类评论系统 - selector: # 评论区图片选择器,例: - # valine: .vcontent img:not(.vemoji) - # twikoo: .tk-content img:not([class*="emo"]) + # 可以处理评论区的图片(不支持 iframe 类评论系统)例如: + # 使用valine评论可以写: .vcontent img:not(.vemoji) + # 使用twikoo评论可以写: .tk-content img:not([class*="emo"]) + selector: .swiper-slide img # 多个选择器用英文逗号隔开 + + # swiper + swiper: + enable: true + css: https://unpkg.com/swiper@6/swiper-bundle.min.css + js: https://unpkg.com/swiper@6/swiper-bundle.min.js style: darkmode: auto # auto / always / false diff --git a/scripts/tags/image.js b/scripts/tags/image.js index 2e1234a..1eea4ff 100644 --- a/scripts/tags/image.js +++ b/scripts/tags/image.js @@ -8,7 +8,7 @@ 'use strict'; hexo.extend.tag.register('image', function(args) { - args = hexo.args.map(args, ['width', 'height', 'bg', 'download', 'padding'], ['src', 'alt']); + args = hexo.args.map(args, ['width', 'height', 'bg', 'download', 'padding', 'fancybox'], ['src', 'alt']); var style = ''; if (args.width) { style += 'width:' + args.width + ';'; @@ -16,12 +16,32 @@ hexo.extend.tag.register('image', function(args) { if (args.height) { style += 'height:' + args.height + ';'; } + // fancybox + var fancybox = false; + if (hexo.theme.config.plugins.fancybox && hexo.theme.config.plugins.fancybox.enable) { + // 主题配置 + if (hexo.theme.config.tag_plugins.image && hexo.theme.config.tag_plugins.image.fancybox) { + fancybox = hexo.theme.config.tag_plugins.image.fancybox; + } + // 覆盖配置 + if (args.fancybox && args.fancybox.length > 0) { + if (args.fancybox == 'true') { + fancybox = true; + } else if (args.fancybox == 'false') { + fancybox = false; + } + } + } + function img(src, alt, style) { let img = ''; img += ' 0) { img += ' style="' + style + '"'; } diff --git a/source/css/_plugins/fancybox.styl b/source/css/_plugins/fancybox.styl new file mode 100644 index 0000000..95cbfc5 --- /dev/null +++ b/source/css/_plugins/fancybox.styl @@ -0,0 +1,5 @@ +img[fancybox='true'] + cursor: zoom-in + +.swiper-slide + cursor: zoom-in diff --git a/source/css/_plugins/index.styl b/source/css/_plugins/index.styl index 30cef8d..2affc8c 100644 --- a/source/css/_plugins/index.styl +++ b/source/css/_plugins/index.styl @@ -5,6 +5,8 @@ if hexo-config('plugins.swiper.enable') @import 'swiper' if hexo-config('plugins.scrollreveal.enable') @import 'scrollreveal' +if hexo-config('plugins.fancybox.enable') + @import 'fancybox' // 评论 if hexo-config('comments.service') == 'beaudar' diff --git a/source/js/main.js b/source/js/main.js index d3f5049..721cb4b 100644 --- a/source/js/main.js +++ b/source/js/main.js @@ -276,12 +276,10 @@ if (stellar.plugins.preload) { // fancybox if (stellar.plugins.fancybox) { - let selector = 'article .tag-plugin.image img'; - - if (stellar.plugins.fancybox.comment.enable) { - selector += `, ${stellar.plugins.fancybox.comment.selector}` + let selector = 'img[fancybox]:not(.error)'; + if (stellar.plugins.fancybox.selector) { + selector += `, ${stellar.plugins.fancybox.selector}` } - if (document.querySelectorAll(selector).length !== 0) { stellar.loadCSS(stellar.plugins.fancybox.css); stellar.loadScript(stellar.plugins.fancybox.js, { defer: true }).then(function () { @@ -297,4 +295,4 @@ if (stellar.plugins.fancybox) { }); }) } -} \ No newline at end of file +}