SafariでJavascriptのoffsetWidthが機能しない

Question

ページのスクロールでヘッダーメニューのすぐ下にスティッキーになるdivがページ中央にあります。問題は、offsetWidthを使用してSafariの対応するdivに幅を追加しないため、スティッキdivの幅が画面サイズに適合しないことです。

私はオンラインで検索し、いくつかの提案やハッキング（例：this link）を見たことがありますが、私の検索では実際には機能しませんでした。

offsetWidthはすべてのブラウザでサポートされるはずなので、Safariに問題がある理由はわかりません。以下のコードは次のとおりです。

JS：

const scheduleControls = document.querySelector('.schedule-controls'); 
const wrap = document.querySelector('.schedule-controls-wrapper'); 

function fixControls(){ 
     const scrollTop = document.body.scrollTop; 
     const wrapOffsetTop = wrap.offsetTop; 
     if((document.querySelector('.section-live').offsetTop - 240) <= scrollTop) { 
      scheduleControls.classList.remove('fixed'); 
      scheduleControls.style = ''; 
     } else if (scrollTop + document.querySelector('.js_site-header').offsetHeight >= wrapOffsetTop) { 
      scheduleControls.classList.add('fixed'); 
      scheduleControls.style = `width:${wrap.offsetWidth}px;`; 
     } else { 
      scheduleControls.classList.remove('fixed'); 
      scheduleControls.style = ''; 
     } 
     } 

CSS：

.schedule-controls { 
    display: flex; 
    height: 70px; 
    transition: all 0.125s ease; 

    &.fixed { 
    position: fixed; 
    top: 60px; 
    height: 80px; 
    border-top: 10px solid $white; 
    background: $white; 

    @media (min-width: $bp-m){ 
     top: 162px; 
    } 
} 

HTML：私が変更した

  <div class="schedule-loading-wrapper js_schedule-loading-wrapper hidden"> 
       <div class="schedule-controls-wrapper" id="scheduleControlsWrapper"> 
        <div class="schedule-controls"> 
    </div> 
</div> 

Answer 1

scheduleControls.style = `width:${wrap.offsetWidth}px;`; 

に

scheduleControls.style.width = wrap.offsetWidth + "px"; 

は、今ではSafariや他のすべてのブラウザで動作します。