github/hexo-theme-next
1
0
Fork 0
mirror of https://github.com/next-theme/hexo-theme-next.git synced 2026-01-17 18:22:33 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add motion.transition.menu_item

Browse Source 
* See: https://github.com/next-theme/hexo-theme-next/issues/412
This commit is contained in:
Mimi 2022-11-23 11:57:21 +08:00
parent aa6da25f89
commit 705201bde3
3 changed files with 14 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
_config.yml
View File

@ -619,6 +619,7 @@ motion:
async: false
transition:
# All available transition variants: https://theme-next.js.org/animate/
menu_item: fadeInDown
post_block: fadeIn
post_header: fadeInDown
post_body: fadeInDown

4
source/css/_common/outline/header/menu.styl
View File

@ -51,6 +51,8 @@
}
}
.use-motion .menu-item {
if (hexo-config('motion.transition.menu_item')) {
.use-motion .menu-item {
visibility: hidden;
}
}

5
source/js/motion.js
View File

@ -59,13 +59,16 @@ NexT.motion.middleWares = {
pushToSequence('.site-subtitle');
(CONFIG.scheme === 'Pisces' || CONFIG.scheme === 'Gemini') && pushToSequence('.custom-logo-image');
const menuItemTransition = CONFIG.motion.transition.menu_item;
if (menuItemTransition) {
document.querySelectorAll('.menu-item').forEach(targets => {
sequence.push({
targets,
complete: () => targets.classList.add('animated', 'fadeInDown'),
complete: () => targets.classList.add('animated', menuItemTransition),
deltaT : '-=200'
});
});
}
return sequence;
},