Twitter Bootstrap 模态窗口 -draggable 不起作用

Posted 2023-05-08

【中文标题】Twitter Bootstrap 模态窗口 -draggable 不起作用

【英文标题】：Twitter Boostrap Modal window -draggable not working

【发布时间】：2016-08-31 11:18:12

【问题描述】：

我在下面有打开模态窗口的链接，我想让模态窗口可拖动。由于某种原因，我的模态窗口可拖动脚本无法正常工作。

这是模态窗口代码和下面的javascript和小提琴链接

MY FIDDLE

模态

<div class="modal fade video2 advSearchModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
  <div class="modal-dialog modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="exampleModalLabel">Video 2</h4>
      </div>
      <div class="modal-body">

        <div class="row">
          <div class="bs-example" data-example-id="responsive-embed-16by9-iframe-youtube">
            <div class="embed-responsive embed-responsive-16by9">

              <video class="embed-responsive-item" controls src="https://www.youtube.com/embed/zpOULjyy-n8?rel=0" type="video/mp4"> </video>

            </div>
          </div>

        </div>

      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        <!-- <button type="button" class="btn btn-primary">Send message</button> -->
      </div>
    </div>
  </div>
</div>

JS

 $(".advSearchModal").draggable(
      handle: ".modal-header"
  );

【问题讨论】：

你可以查看这个帖子，已经回答了:) ***.com/a/22509959/6296341

【参考方案1】：

您的代码中没有包含 jQuery UI。这是必需的，因为它不是 jQuery 的标准部分。