UIkit |从模态中打开Offcanvas并在后台保留模态

Question

我正在使用UIkit开发网站，我的目标是从模式中打开画布，但保存在后台打开的模式状态。

我尝试过

<div id="offcanvas-flip" uk-offcanvas="flip: true;container: true;">

但没有成功

这是我的模态：

<div id="modal-arredamento" class="uk-modal-full" uk-modal>
              <div class="uk-modal-dialog">
                <button class="uk-close-large uk-modal-close-default" type="button" uk-close></button>
                  <div class="uk-width-expand" uk-height-viewport>
                    <div uk-slider="center: true">
                      <div class="uk-position-relative uk-visible-toggle">
                        <ul class="uk-slider-items uk-child-width-1-1@s uk-grid">
                            <li>
                                <div class="uk-card uk-card-default uk-grid-collapse uk-child-width-1-2@s uk-margin" uk-grid uk-height-viewport>
                                  <div class="uk-card-media-left uk-cover-container">
                                      <img src="<?php echo base_url(); ?>public/images/mdm-armadi.webp" alt="" uk-cover>
                                      <canvas width="600" height="400"></canvas>
                                  </div>
                                  <div>
                                      <div class="uk-card-body">
                                          <h3 class="uk-margin-remove-top text-huge uk-text-bold dark-color">Gli armadi.</h3>
                                          <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt.</p>
                                          <div class="uk-button-group">
                                            <button class="uk-button uk-button-default" type="button" uk-toggle="target: #offcanvas-flip">Open</button>
                                            <div id="offcanvas-flip" uk-offcanvas="flip: true;container: true;">
                                              <div class="uk-offcanvas-bar">

                                                <button class="uk-offcanvas-close" type="button" uk-close></button>

                                                <h3>Title</h3>

                                                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>

                                              </div>
                                            </div>
                                          </div>
                                      </div>
                                  </div>
                                </div>
                            </li>
                            <li>
                                <div class="uk-card uk-card-default uk-grid-collapse uk-child-width-1-2@s uk-margin" uk-grid uk-height-viewport>
                                  <div class="uk-card-media-left uk-cover-container">
                                      <img src="https://getuikit.com/docs/images/dark.jpg" alt="" uk-cover>
                                      <canvas width="600" height="400"></canvas>
                                  </div>
                                  <div>
                                      <div class="uk-card-body">
                                          <h3 class="uk-card-title">Media Left</h3>
                                          <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt.</p>
                                      </div>
                                  </div>
                                </div>
                            </li>
                            <li>
                                <div class="uk-card uk-card-default uk-grid-collapse uk-child-width-1-2@s uk-margin" uk-grid uk-height-viewport>
                                  <div class="uk-card-media-left uk-cover-container">
                                      <img src="https://getuikit.com/docs/images/photo.jpg" alt="" uk-cover>
                                      <canvas width="600" height="400"></canvas>
                                  </div>
                                  <div>
                                      <div class="uk-card-body">
                                          <h3 class="uk-card-title">Media Left</h3>
                                          <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt.</p>
                                      </div>
                                  </div>
                                </div>
                            </li>
                        </ul>

                        <a class="uk-position-center-left uk-position-small uk-hidden-hover" href="#" uk-slidenav-previous uk-slider-item="previous"></a>
                        <a class="uk-position-center-right uk-position-small uk-hidden-hover" href="#" uk-slidenav-next uk-slider-item="next"></a>

                      </div>

</div>
                </div>
              </div>
          </div>

如何实现我的目标？