d0zingcat/NotionNext
1
0
Fork 0
mirror of https://github.com/d0zingcat/NotionNext.git synced 2026-05-14 15:09:22 +00:00
Code Issues Packages Projects Releases Wiki Activity

右下角悬浮按钮调整

Browse Source
This commit is contained in:
tangly1024
2022-01-07 11:19:32 +08:00
parent b1d23592f8
commit a8a8df0209
3 changed files with 5 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
components/JumpToBottomButton.js
View File

@@ -18,11 +18,11 @@ const JumpToBottomButton = ({ showPercent = false }) => {
return <></>
}
const targetRef = typeof window !== 'undefined' ? document.getElementById('wrapper') : undefined
const { locale } = useGlobal()
const [show, switchShow] = useState(false)
const [percent, changePercent] = useState(0)
const scrollListener = () => {
const targetRef = document.getElementById('wrapper')
const clientHeight = targetRef?.clientHeight
const scrollY = window.pageYOffset
const fullHeight = clientHeight - window.outerHeight
@@ -36,6 +36,7 @@ const JumpToBottomButton = ({ showPercent = false }) => {
}
function scrollToBottom () {
const targetRef = document.getElementById('wrapper')
window.scrollTo({ top: targetRef.clientHeight, behavior: 'smooth' })
}

3
components/JumpToTopButton.js
View File

@@ -20,9 +20,8 @@ const JumpToTopButton = ({ showPercent = false }) => {
const { locale } = useGlobal()
const [show, switchShow] = useState(false)
const [percent, changePercent] = useState(0)
const targetRef = typeof window !== 'undefined' ? document.getElementById('wrapper') : undefined
const scrollListener = () => {
// 处理是否显示回到顶部按钮
const targetRef = document.getElementById('wrapper')
const clientHeight = targetRef?.clientHeight
const scrollY = window.pageYOffset
const fullHeight = clientHeight - window.outerHeight

4
components/TocDrawerButton.js
View File

@@ -31,8 +31,8 @@ const TocDrawerButton = (props) => {
})
return (
<div id='toc-drawer-button' className='right-1 fixed bottom-52 duration-500 z-20'>
<div onClick={props.onClick} className={(show ? 'animate__fadeInRight' : 'hidden') + ' animate__animated glassmorphism cursor-pointer' }>
<div id='toc-drawer-button' className='right-1 fixed bottom-52 z-20'>
<div onClick={props.onClick} className={(show ? 'animate__fadeInRight' : 'hidden') + ' animate__animated animate__faster glassmorphism cursor-pointer' }>
<div className='dark:text-gray-200 text-center transform hover:scale-150 duration-200 text-xs flex justify-center items-center w-8 h-8' title={locale.POST.TOP} >
<FontAwesomeIcon icon={faListOl}/>
</div>