Drag and Drop Enabler

WHAT IT DOES

Drag and Drop Enabler is a browser extension that enables drag-and-drop functionality on webpages that block it. Many websites disable dragging of images, links, and text using JavaScript event listeners (ondragstart, ondrag, ondrop) and CSS properties (user-select: none). This tool removes those restrictions, allowing you to drag images to your desktop, drag links to bookmarks, and select text that was previously unselectable. The tool applies to all images, links, and elements on the page, and you can toggle the feature on or off at any time. The tool is ideal for users who want to save images, drag links, or select text on sites that have disabled these features.

WHERE IT RUNS

Drag and Drop Enabler runs on any webpage, overlaying a floating panel that does not interfere with page content. It operates entirely in your browser as a lightweight userscript, modifying DOM elements and overriding event listeners. It works on any page, whether static or dynamic, with no external dependencies. All settings are stored locally using GM_setValue—no data is ever sent to any server.

HOW TO USE

After installation, open the floating panel by clicking the extension icon. The panel shows the current status (Enabled or Disabled) and a toggle button to enable or disable the feature. When enabled, the tool removes drag-blocking event listeners from all images, links, and other elements on the page. It also removes user-select: none CSS properties and adds draggable="true" to images and links. The tool automatically applies to dynamically added elements using a MutationObserver. Click the "Reapply" button to manually reprocess all elements on the page—useful if new content has been loaded via AJAX. The setting is saved per website, so you can have different preferences for different sites.

REAL MECHANISM — WHY THIS WORKS

Most drag-blocking websites use a combination of inline event handlers, CSS properties, and event listeners to prevent users from dragging content. Drag and Drop Enabler uses a multi-pronged approach to override these restrictions. First, it iterates over all images, links, and other elements on the page and removes inline event handlers (ondragstart, ondrag, ondrop, ondragover) by setting them to null. Second, it strips user-select: none from style attributes and overrides the computed style using a high-specificity CSS rule. Third, it sets draggable="true" on images and links to enable native drag behavior. Fourth, it overrides document-level event listeners by adding capturing-phase event listeners that call stopPropagation() to prevent blocking events from reaching the page's handlers. The tool uses a MutationObserver to watch for dynamically added elements and automatically applies the same changes to them. The toggle simply enables or disables the processing logic and removes the overriding CSS when disabled. This approach ensures comprehensive drag-and-drop enabling without requiring any external services or network access.

THE PANEL

The floating panel is fully draggable and remembers its position per site, snapping to the edges of the viewport when dragged near them. You can collapse the panel to a small icon to minimize screen distraction and expand it back with a single click. The panel is resizable from the bottom-right corner, giving you more space to view controls. Press the Escape key to close the panel instantly. The panel remains open across page navigation within the same domain, maintaining your current view state. All preferences—panel position and enabled state—are saved per domain for a seamless experience.

PLEASE NOTE

Drag and Drop Enabler requires the free BotGentz extension to be installed and enabled, as it relies on the cross-extension messaging API provided by BotGentz for DOM access permissions. The tool modifies DOM elements and event listeners on the page. Some websites may have additional restrictions not covered by this tool, such as canvas-level blocking or server-side protections. The tool may not work on pages that use Shadow DOM or iframes from different origins. All settings are stored locally in your browser using GM_setValue. No page content, drag data, or usage information is ever sent to any server. The extension does not read, store, or transmit any personal information. It only modifies DOM elements and event listeners at your request.