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

Optimize sidebar panel animation

Browse Source
This commit is contained in:
Mimi 2020-11-01 23:47:47 +08:00
parent 817ef092ac
commit d19109a7b4
1 changed files with 3 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
source/js/next-boot.js
View File

@ -48,12 +48,12 @@ NexT.boot.registerEvents = function() {
element.addEventListener('click', () => { element.addEventListener('click', () => {
if (element.matches('.sidebar-toc-active .sidebar-nav-toc, .sidebar-overview-active .sidebar-nav-overview')) return; if (element.matches('.sidebar-toc-active .sidebar-nav-toc, .sidebar-overview-active .sidebar-nav-overview')) return;
const sidebar = document.querySelector('.sidebar-inner'); const sidebar = document.querySelector('.sidebar-inner');
const panel = document.querySelectorAll('.sidebar-panel'); const panel = document.querySelector('.sidebar-panel-container');
const activeClassName = ['sidebar-toc-active', 'sidebar-overview-active']; const activeClassName = ['sidebar-toc-active', 'sidebar-overview-active'];
window.anime({ window.anime({
duration, duration,
targets : panel[1 - index], targets : panel,
easing : 'linear', easing : 'linear',
opacity : 0, opacity : 0,
translateY: [0, -20], translateY: [0, -20],
@ -62,7 +62,7 @@ NexT.boot.registerEvents = function() {
sidebar.classList.replace(activeClassName[1 - index], activeClassName[index]); sidebar.classList.replace(activeClassName[1 - index], activeClassName[index]);
window.anime({ window.anime({
duration, duration,
targets : panel[index], targets : panel,
easing : 'linear', easing : 'linear',
opacity : [0, 1], opacity : [0, 1],
translateY: [-20, 0] translateY: [-20, 0]