How to implement a draggable popup in OpenLayers, to have the ability to decide which class will be draggable and which one will not be?
For a project I needed to be able to drag the OpenLayer popups, the problem was there were some implementations online, but I needed for the popup to be only draggable on the title, and for input elements not to interfere with the dragging process. Becase when I clicked on an input, textarea it suddenly stared dragging and it was a mess.
So the solution was to implement a control that will do all that for me.
Let’s see some of the available options:
Which html elements should we ignore for dragging, this is useful so we don’t accidentally drag the popup on some of the elements inside the popup, like input elements.
Which selectors do we ignore, this is an array that is used to check if we should move the element or not.
On which selector do we move, this can be a title or an icon, and we use this to determine if we should move or not.
To view a demo implementation, you can open this jsfiddle