From aab8119ad66583d65d517e2eb8e574b8794180c9 Mon Sep 17 00:00:00 2001 From: inleft <inleft@qq.com> Date: Sun, 16 Jan 2022 20:58:19 +0800 Subject: [PATCH] 无限列表滚动 --- src/components/layouts/baseLayout.vue | 15 ++++++++++++--- 1 files changed, 12 insertions(+), 3 deletions(-) diff --git a/src/components/layouts/baseLayout.vue b/src/components/layouts/baseLayout.vue index 9d5a6ee..d10c048 100644 --- a/src/components/layouts/baseLayout.vue +++ b/src/components/layouts/baseLayout.vue @@ -1,10 +1,10 @@ <template> <a-layout> - <a-layout-header :style="{position:'fixed',height:'60px',marginBottom:'35px',zIndex: 999, width: '100%' }"> - <tag-Header /> + <a-layout-header class="scrolling-navbar" :style="{position:'fixed',height:'60px',marginBottom:'35px',zIndex: 999, width: '100%' }"> + <tag-Header /> </a-layout-header> - <router-view class="fade"></router-view> + <router-view ></router-view> <a-layout-footer> <tagFooter /> @@ -60,8 +60,11 @@ .ant-layout {} .ant-layout-header { + // background-color: #ffffff; backdrop-filter: saturate(180%) blur(1em); + -webkit-backdrop-filter: blur(5px); + background: linear-gradient(90deg, rgba(247, 149, 51, 0.101961) 0, rgba(243, 112, 85, 0.101961) 15%, rgba(239, 78, 123, 0.101961) 30%, rgba(161, 102, 171, 0.101961) 44%, rgba(80, 115, 184, 0.101961) 58%, rgba(16, 152, 173, 0.101961) 72%, rgba(7, 179, 155, 0.101961) 86%, rgba(109, 186, 130, 0.101961) 100%); } @@ -89,6 +92,12 @@ letter-spacing: 0.8px; line-height: 22px; } + + .scrolling-navbar { + will-change: background, padding,height; + -webkit-transition: background 0.5s ease-in-out, padding 0.5s ease-in-out; + transition: background 0.5s ease-in-out, padding 0.5s ease-in-out; + } .fade { -webkit-animation-name: "fade"; -- Gitblit v1.9.1