While clicking on an image on a web page and trying to drag it from one point to another, often a replica of the image follows the cursor movement until it is dragged. This replica of the image is termed a ghost image.
Due to personal preferences or requirements of the website, it may be required to prevent this ghost image from being produced on the screen, that is, sometimes it may be required to prevent the dragging of a ghost image. The example below shows what a ghost image looks like by default.
In the above example, when the image is clicked and dragged, it creates a draggable ghost image that follows the cursor. To prevent dragging of this ghost image, the draggable attribute is used. On setting this attribute for that image element to “false”, its dragging is prevented. The below example demonstrates this.
- How to Create Ghost Text Animation on Hover using HTML and CSS?
- How to trigger onchange event on input type=range while dragging in Firefox ?
- How to prevent parents of floated elements from collapsing in CSS?
- How to prevent line breaks in the list of items using CSS?
- How to prevent text in a table cell from wrapping using CSS?
- How to prevent column break within an element?
- How to prevent inline-block divs from wrapping ?
- How to prevent XSS with HTML/PHP ?
- Prevent System from Entering Sleep mode in ElectronJS
- How to prevent browser to remember password in HTML ?
- Convert an image into grayscale image using HTML/CSS
- How to hide “Image not found” icon when source image is not found?
- How to specify an image as a server-side image-map in HTML ?
- How to use animation on favicon image ?
- HTML | Responsive full page image using CSS
- HTML | Mapping Image
If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to email@example.com. See your article appearing on the GeeksforGeeks main page and help other Geeks.
Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.