update: 打开 PlayCard 后,隐藏页面 scroll bar

feature/qrcode
mackt 5 months ago
parent f869f47cb0
commit a7b840a3cb

@ -20,7 +20,15 @@ body {
min-height: 100%; min-height: 100%;
} }
html {
overflow-x: hidden;
overflow-y: auto;
}
body { body {
width: 100vw;
overflow: hidden;
/* padding-left: calc(100vw - 100%); */
background: var(--body-bg-color); background: var(--body-bg-color);
font-family: font-family:
'D-DINExp', 'D-DINExp',

@ -36,27 +36,8 @@ const PlayerBar = ({ className }: { className?: string }) => {
footerDom.style.paddingBottom = audioId || showCard ? '80px' : '0'; footerDom.style.paddingBottom = audioId || showCard ? '80px' : '0';
}, [audioId, showCard]); }, [audioId, showCard]);
// let timer: NodeJS.Timeout;
// function handleScroll() {
// clearInterval(timer);
// setShowbar(false);
// timer = setTimeout(() => {
// setShowbar(true);
// }, 800);
// }
// useEffect(() => {
// window.addEventListener('scroll', handleScroll);
// return () => {
// window.removeEventListener('scroll', handleScroll);
// clearInterval(timer);
// };
// }, []);
return ( return (
<div className={`fixed bottom-0 w-full h-auto z-10 ${className}`}> <div className={`fixed bottom-0 w-100vw h-auto z-10 ${className}`}>
{/* 播放器 */} {/* 播放器 */}
<div <div
className="fixed bottom-0 w-full h-[90px] bg-[#fff] bg-op-80 backdrop-blur-[20px] shadow-lg shadow-black-[0_0_10px] z-10 transition-bottom duration-600`" className="fixed bottom-0 w-full h-[90px] bg-[#fff] bg-op-80 backdrop-blur-[20px] shadow-lg shadow-black-[0_0_10px] z-10 transition-bottom duration-600`"

@ -111,6 +111,10 @@ export default function PlayerCard({ show, className }: Prop) {
const freeHeight = rightHeight - 24 - 15; // 空区域高度 const freeHeight = rightHeight - 24 - 15; // 空区域高度
const listHeight = freeHeight - (freeHeight % 78); // 减掉冗余高度 const listHeight = freeHeight - (freeHeight % 78); // 减掉冗余高度
setPlayListHeight(listHeight); setPlayListHeight(listHeight);
// 隐藏滚动条
const htmlDom = document.querySelector('html');
if (htmlDom) htmlDom.style.overflowY = show ? 'hidden' : 'auto';
}, [show]); }, [show]);
return ( return (

Loading…
Cancel
Save