spcommon.png sprite / image - accidental drag and drop

Question

When a new document is added to a library, a green star icon is displayed, designating that this a new document.

This icon comes from the spcommon.png sprite file.

Using Internet Explorer, we have found that users occasionally accidentally drag and drop this icon into the same library, causing a duplicate spcommon.png file to be placed in the library.

Due to how our system generates a record number for each new file in a library, we need to prevent this from happening.

Using this code we can disable image dragging and dropping in some circumstances:

$(document).ready(function(event) {

    $('img').on('dragstart', function (event) { event.preventDefault(); });

});

However, when a new document is first uploaded to the library, this code doesn't work or isn't triggered. It only works when the page is refreshed or navigated to for the first time. As soon as any new file is dragged to the library and the SharePoint file uploader is triggered, this code doesn't work until a page refresh.

How can we prevent the spcommon.png file from being accidentally dragged and dropped in all circumstances for Internet Explorer?

Thanks!

Answer 1

Try to change your code by adding dinamically binding for new DOM elements with class .ms-newdocument-icon:

$("body").on("dragstart", ".ms-newdocument-icon", function (event) { 
 event.preventDefault(); 
});

Just for information, in chrome you can use CSS trick:

img {
    -webkit-user-drag: none;
}