Тащить модальное окно Bootstrap мышью

Я использую модальное окно Bootstrap: Как я могу делать для того, чтобы было возможно тащить мышью модальное окно, так как она остается статической?

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8">
  <title></title>
  <meta name="description" content="Modal Window ">
  <link href="bootstrap.css" rel="stylesheet">
</head>

<body>
  <div class="container">
    <h2>Modals con Twitter Bootstrap</h2>
    <div id="example" class="modal hide fade in" style="display: none; ">
      <div class="modal-header">
        <a class="close" data-dismiss="modal">×</a>
        <h3>Cabecera de la ventana</h3>
      </div>
      <div class="modal-body">
        <h4>Texto de la ventana</h4>
        <p>Mas texto en la ventana.</p>
      </div>
      <div class="modal-footer">
        <a href="index.html" class="btn btn-success">Guardar</a>
        <a href="#" class="btn" data-dismiss="modal">Cerrar</a>
      </div>
    </div>
    <p><a data-toggle="modal" href="#example" class="btn btn-primary btn-large">Abrir</a>
    </p>
    <script src="jquery.js"></script>
    <script src="bootstrap-modal.js"></script>
</body>

</html>
0
задан 02.04.2016, 02:31
2 ответа

С jquery ты можешь использовать функцию draggable, та же самая позволяет двигать элементы используя мышь, для твоего модального example код был бы:

$("#example").draggable({
    handle: ".modal-header"
}); 

Для больше документации ты можешь visiar https://jqueryui.com / draggable/. Привет

1
ответ дан 24.11.2019, 14:39

Проверь этот пример, где он использует то, что они прокомментировали тебе draggable jquery: http://jsfiddle.net/raving/gL6zodx7/

типов Привета

2
ответ дан 24.11.2019, 14:39