我試圖創建一個有背景圖像的標題，但是當用戶滾動時，標題需要很長時間來改變顏色，最后與正文重疊。任何關于我如何防止標題和正文重疊的提示將不勝感激。 我的代碼和頁面在滾動條上的樣子如下

<div>

      <Header
        color="transparent"
        brand="Truhditions"
        rightLinks={<HeaderLinks />} 
        fixed
        changeColorOnScroll={{
          height: 200,
          color: "white"
        }}
        {...rest}
      />

    <Parallax small filter image={require("assets/img/profile-bg.jpg")} style={{height: 250}}/>


      <div className={classes.container} style={{background:"#E5E5E5"}}>
     
      <BusinessesSection category={rest.location.data} />
      </div>

      <Footer />
    </div>

當前滾動效果

預期滾動效果: 預期滾動效果