draggable – Page 3 – Tarik Billa

jQuery UI – Draggable is not a function?

March 4, 2023 by Tarik

A common reason this occurs is if you don’t also load jqueryui after loading jquery. For example: <script src=”https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js” type=”text/javascript”></script> <script src=”https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js” type=”text/javascript”></script> EDIT. Replace the version number for each library with appropriate or latest values for jquery and jqueryui. If this doesn’t solve the issue, review suggestions in the many other answers.

jQuery draggable shows helper in wrong place after page scrolled

February 6, 2023 by Tarik

This might be a related bug report, it’s been around for quite a while: http://bugs.jqueryui.com/ticket/3740 It seems to happen on every browser I tested (Chrome, FF4, IE9). There are a few ways you can work around this issue: 1. Use position:absolute; in your css. Absolutely positioned elements don’t seem to be affected. 2. Make sure … Read more

Determine what is being dragged from dragenter & dragover events

February 2, 2023 by Tarik

I wanted to add a very clear answer here so that it was obvious to everyone who wanders past here. It’s been said several times in other answers, but here it is, as clear as I can make it: dragover DOES NOT HAVE THE RIGHTS to see the data in the drag event. This information … Read more

How can I make a jQuery UI ‘draggable()’ div draggable for touchscreen?

December 24, 2022 by Tarik

After wasting many hours, I came across this! jquery-ui-touch-punch It translates tap events as click events. Remember to load the script after jquery. I got this working on the iPad and iPhone $(‘#movable’).draggable({containment: “parent”});

Preventing an image from being draggable or selectable without using JS

October 24, 2022 by Tarik

Set the following CSS properties to the image: .selector { user-drag: none; -webkit-user-drag: none; user-select: none; -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; }