即时通讯开发一个网站使用html,React和顺风。网站似乎在桌面上工作,但在移动的浏览器的网站不正常工作。
向下滚动时,导航栏不会滚动到页面顶部。我相信问题主要是因为CSS和y方向的溢出。如何解决此问题?
这是我的网站url。确保在移动的浏览器中打开它。问题似乎未出现在桌面中。
<header className="w-screen bg-white fixed h-fit z-10 top-0 left-0 ">
<nav className="w-full flex items-center justify-between px-5 py-4 ">
<div className="flex gap-2 items-center">
{/*Menu Icon*/}
<FcMenu fontSize={24} className="text-color-font-tertiary cursor-pointer"
onClick={() => setToggleSidebar(!toggleSidebar)}/>
{/*App logo*/}
<Link to={"/"} className="text-xl font-bold text-color-font-primary cursor-pointer">Up<span
className="text-color-primary-blue">Share</span></Link>
</div>
{/*search icon*/}
<Link to={"/search"} onClick={() => {
}}>
<RiSearchLine fontSize={22} className="text-color-font-tertiary cursor-pointer"/>
</Link>
</nav>
</header>
1条答案
按热度按时间wkyowqbh1#
在移动的浏览器上,如果想让导航条在向下滚动时滚动到页面顶部,可以尝试在CSS中移除*******header元素中的**“固定”**位置。通过这样做,导航栏将滚动到页面的顶部时,向下滚动。