Есть ли простой способ сделать прокрутку щелчка и перетаскивания в текстовых фреймах?
у меня есть div с overflow:auto
и полоса прокрутки, и я хотел бы иметь возможность перетаскивать содержимое для прокрутки. Мне не нужно выбирать текст. Существует ли простой способ сделать это? Плагин jQuery был бы хорош, иначе простой старый JavaScript был бы в порядке.
Кажется, я недостаточно ясно выразился. Есть div с фиксированной высотой, которую я хочу прокрутить. Вместо того, чтобы поднимать полосу прокрутки, я хочу щелкнуть и перетащить текст в противоположном направлении. Как на айфон. Как в Photoshop, когда вы удерживаете пространство и перетаскиваете.
-------------------
| | |
| | |
| |||
| | |
| <----------- click here and drag to scroll.
| | |
| | |
-------------------
3 ответов
вот хорошая имплементация перетаскивания и прокрутки divs
http://plugins.jquery.com/project/Dragscrollable
ниже приведена моя исходная ссылка, которую я опубликовал. Похоже, кто-то отредактировал мой ответ.
http://hitconsultants.com/dragscroll_scrollsync/scrollpane.html
вы имеете в виду, что контент должен прокручиваться при перемещении полосы прокрутки?
сделайте новый div для контента, который вы хотите перетащить, и поместите его на div, который вы прокручиваете. проверьте код.
<div style="position:relative; overflow:hidden;">
<div id="dragableContent"
style="float: left;display: none;background:none repeat scroll 0 0 white; border:1px solid #323C45; border-width:0px 1px 0px 1px;"></div>
<div> This is you content div...</div>
</div>
затем при загрузке страницы вы можете сделать div видимым после установки его содержимого HTML.
$(document).ready(function() {
stripColumnFromDiv('Your content Div ID');
var scrollingDiv = $("#dragableContent");
scrollingDiv.css({'position':'absolute','display':'block'});
});
здесь stripColumnFromDiv
функция устанавливает данные из вашего элемента в новый пустой dragableContent
.
Я надеюсь, что это то, что вы хотите,и помогает вы.
спасибо.
в jQuery UI есть плагин под названием draggable благодаря этому вы можете изменить любой элемент в объект перетаскиваемым
вот ссылка на демо http://jqueryui.com/demos/draggable/
Это просто
<script type="text/javascript">
$(function() {
$("#draggable").draggable();
});
</script>
также можно сделать его прокручиваемым внутри div. Проверьте демо-страницу