Какой самый простой способ сделать что-то перетаскиваемым с помощью jQuery? - PullRequest
Новая
       1

Какой самый простой способ сделать что-то перетаскиваемым с помощью jQuery?

0 голосов
/ 17 июня 2011

У меня есть простой информационный div, который я хочу сделать перетаскиваемым по экрану, чтобы пользователь мог разместить его «в стороне» в зависимости от того, что еще находится на экране.

В поисках простого решения - на самом деле не хочу зависеть от других библиотек jquery - с использованием базового интерфейса jquery и jquery

Ответы [ 3 ]

2 голосов
/ 17 июня 2011

Попробуйте: 

  <html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"                          type="text/javascript"></script> 
        <script   src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.12/jquery-ui.min.js" type="text/javascript"></script> 
<style>
#draggable { width: 150px; height: 150px; padding: 0.5em; }
</style>
<script>
$(function() {
    $( "#draggable" ).draggable();
});
</script>

</head>
<body>

<div class="demo">

<div id="draggable" class="ui-widget-content">
<p>Drag me around</p>
</div>

</div><!-- End demo -->



 <div class="demo-description" style="display: none; ">
 <p>Enable draggable functionality on any DOM element. Move the draggable object by clicking  on it with the mouse and dragging it anywhere within the viewport.</p>
</div><!-- End demo-description -->
</body>
</html>
0 голосов
/ 17 июня 2011

Пожалуйста, установите эту ссылку

http://jqueryui.com/demos/draggable/


<style>
    #draggable { width: 150px; height: 150px; padding: 0.5em; }
    </style>
    <script>
    $(function() {
        $( "#draggable" ).draggable();
    });
    </script>



<div class="demo">

<div id="draggable" class="ui-widget-content">
    <p>Drag me around</p>
</div>

</div><!-- End demo -->



<div style="display: none;" class="demo-description">
<p>Enable draggable functionality on any DOM element. Move the draggable object by clicking on it with the mouse and dragging it anywhere within the viewport.</p>
</div><!-- End demo-description -->
0 голосов
/ 17 июня 2011

Пользовательский интерфейс Jquery: http://jqueryui.com/demos/draggable/

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...