Bootstrap5のOffcanvasでスクロール位置を保持する方法

Bootstrap5のOffcanvasを使用する際、Offcanvasが開いている状態でbodyをスクロールし、その後Offcanvasを閉じると元の位置（トグルボタンの位置）に戻ってしまうという問題があります。ただし、トグルボタンを固定（fix）している場合は、この問題は発生しません。

これを解決するために、JavaScriptを使用してOffcanvasをトグルするようにします。以下にそのコードを示します。

var search_box = document.getElementById('search-box');
var search_box_canvas = new bootstrap.Offcanvas(search_box);
$('.toggle-search').on('click', function(e) {
e.preventDefault();
e.stopPropagation();
search_box_canvas.toggle();
});

上記のコードでは、まずOffcanvasの要素を取得し、新しいOffcanvasインスタンスを作成します。そして、トグルボタンがクリックされた際に、デフォルトのイベントと伝播を防ぎ、Offcanvasをトグルします。

この方法であれば、Offcanvasを閉じた後もスクロール位置を保持することができます。