draggable

How to scroll through a div by dragging and not by using the scroll bars

给你一囗甜甜゛ 提交于 2019-12-20 19:39:15
问题 I am working on a project that uses a touch-screen interface. I have a div inside of a smaller div, so the smaller div has scroll bars to access the rest of the first div. Here is the basic code for it. .div1{ height: 100px; width: 100px; } .div2{ height: 50px; width: 50px; } and the html is: <div id = "div2" class="div2"> <div id="div1" class="div1"></div> </div> Using javascript, I would like to be able to scroll through div2 by pressing (since it is a touch screen) an unoccupied part of

jQuery: draggable connect to sortable. draggable item has a different DOM from sortable list

谁说胖子不能爱 提交于 2019-12-20 12:40:56
问题 I am now able to drag an item to a sortable. But the sortable list has a different DOM. <!-- The draggable items. Has the "original" DOM in the LI tags. --> <ul class="draggable_text"> <li><span>DRAG THIS A</span></li> <li><span>DRAG THIS B</span></li> </ul> <!-- This list has a different DOM in the LI tags --> <ul id="stagerows"> <li><p>This is a new DOM dragged from "DRAG THIS A"</p></li> <li><p>This is a new DOM dragged from "DRAG THIS B"</p></li> </ul> $(document).ready(function() { $('

Draggable JS Bootstrap modal - performance issues

故事扮演 提交于 2019-12-20 09:45:12
问题 For a project at work we use Bootstrap Modal windows in JavaScript. We would like to make some of the windows movable, but we are running into performance issues with JQuery. $("#myModal").draggable({ handle: ".modal-header" }); Example , Source . In IE9, it works as expected. In Chrome, horizontal dragging works as expected, and vertical dragging is rather slow but not problematic. In Firefox, horizontal dragging works as expected, but vertical dragging is extremely slow. It's strange,

HTML 段落<p>标签

ぐ巨炮叔叔 提交于 2019-12-20 06:47:17
<p> 标签定义段落。 p 元素会自动在其前后创建一些空白。浏览器会自动添加这些空间,您也可以在样式表中规定。 段间距 IE默认为19px,通过p的margin-top属性设置 FF默认为1.12em,通过p的margin-bottom属性设置 p默认为块状显示,要清除段间距,一般可以设置 p { margin-top:0; margin-bottom:0; } 延伸阅读:允许的段落用法 可以只在块(block)内指定段落,也可以把段落和其他段落、列表、表单和预定义格式的文本一起使用。总的来讲,这意味着段落可以在任何有合适的文本流的地方出现,例如文档的主体中、列表的元素里,等等。 从技术角度将,段落不可以出现在头部、锚或者其他严格要求内容必须只能是文本的地方。实际上,多数浏览器都忽略了这个限制,它们会把段落作为所含元素的内容一起格式化。 <html> <body> <p>这是段落。</p> <p>这是段落。</p> <p>这是段落。</p> <p>段落元素由 p 标签定义。</p> </body> </html> HTML中 P标签内不可包含DIV标签 深究: 我们先来认识in-line内联元素和block-line块元素,因为HTML里几乎所有元素都属于内联元素或者块元素中的一种。 in-line这个词有很多种解释:内嵌、内联、行内、线级等,但是,它们都是表示相同的意思

JQuery Draggable + Sortable: How to tell if item was actually added to my sortable list?

狂风中的少年 提交于 2019-12-20 05:36:06
问题 OK, I'm probably missing something obvious here, but my searches aren't turning up anything helpful. I've set up a sortable list and connected a draggable "palette list" to it, as explained here: http://jqueryui.com/demos/draggable/#sortable I can drag items from my draggable list and drop them on my sortable list. That works fine. I need to fire a function only when one of these items is dropped onto the sortable. I've tried the "stop" hook on the draggable item, but that fires regardless of

jQuery draggable outside of browser

扶醉桌前 提交于 2019-12-20 03:42:16
问题 Currently, without using jQuery it is possible to drag an image from your browser onto your desktop (firefox, chrome, safari). I'd like to achieve the same thing using jQuery draggable. Currently, if I try dragging a 'draggable' element, the element disappears when it leaves the browser window. Any ideas if this is possible, if so how? Thanks. 回答1: Here is a similar discussion with respect to images: Is it possible to Drag-and-Drop images between Web sites (applications)? 来源: https:/

Resizing a JQuery Draggable element's containment parent while dragging

帅比萌擦擦* 提交于 2019-12-20 03:18:09
问题 I have a div 'slide' element within another div 'box' parent container and have applied JQuery Draggable to the child. While the item is being dragged, I'm resizing the parent container, sometimes shrinking, sometimes enlarging it. The problem is that JQuery doesn't respond to this resizing and still contains the dragged element within the original dimensions of the parent, rather than within its current size, until mouseup - the next drag session will use the new dimensions (until it changes

revert 'invalid' with grid doesn't return to start position with jQuery UI Draggable

假如想象 提交于 2019-12-19 19:04:52
问题 In a nutshell, if you use draggable with a grid and set revert: 'invalid' on draggable items they don't return to exactly the same place you started dragging them from. They return to a place close to where you started dragging them...pretty weird. This could well be a bug in UI. If so, does anyone know if there's a workaround for it? Example: http://jsfiddle.net/n2AUv/11/ Thanks! John. 回答1: grid option documentation says: Snaps the dragging helper to a grid, every x and y pixels. So it looks

Changing Raycaster position dynamically

梦想与她 提交于 2019-12-19 11:39:11
问题 I have a canvas, inside that I have several cubes. I use Raycaster to select them and change their colors. But the canvas is inside of a draggable object and when I move around I cannot change the colors, the color changing works in the original position. I think I also have to change the dimensions of the Raycaster. How can I do that? Here is the example. 回答1: try to change a code as follows: function onDocumentMouseDown( event ) { event.preventDefault(); var x = event.offsetX == undefined ?

jQuery UI : Combining Selectable with Draggable

自闭症网瘾萝莉.ら 提交于 2019-12-19 10:55:30
问题 I'm having a big problem trying to get my head round how the selectable() and draggable() components of jqueryUI can work together. They work fine on their own. I am trying to create a file browser type interface that users can select multiple files or drag INDIVIDUAL files to other droppable places in the app. I know a lot of people have been looking at ways to drag multiple files but this is not a requirement for me at the moment. In the example provided selectable works if using the mouse