jQuery: prevent copying elements from webpage

4 10 2014

Want to prevent users copying text or images on your website? Or maybe you need to add custom behaviour on Ctrl+C click event?

With jQuery you can intercept the event of copying, pasting, cutting or dragging & dropping the element on your webpage.

Prevent copying

In my case I needed to prevent copying images on webpage (the whole body). This is the method I call on document.ready callback:

var preventCopyPaste = function(){
	$('body').bind('copy paste cut drag drop', function (e) {
   		e.preventDefault();
	});
};

If you need any other custom action to be performed instead of preventing default behaviour, just implement it in method body.

Test it!

Try to copy any image from karomile.com, where I used this method. If you manage to do it – let me know how you did it. I’ll make it even more bulletproof :)

I suspect that there is one way of doing it…

Did I help you?
I manage this blog and share my knowledge for free, sacrificing my time. If you appreciate it and find this information helpful, please consider making a donation in order to keep this page alive and improve quality

Donate Button with Credit Cards

Thank You!

Advertisements




Online coding courses on CodeAcademy and CodeSchool

22 03 2014

Coding is not to be learned by reading books and knowing theory, but by coding in practice. There are coding courses on these sites, however the real experience can be gathered on interactive coding lessons when you learn by doing coding.

Sites that have it are CodeAcademy (free) and CodeSchool (free trials, paid when accessing more courses).

How does it work?

The idea is to code during course. User gets short instructions and explanations and can write code to see how it really works. When something gone wrong with his code, he is instructed how to fix it. The learning windows looks as follows:

codelesson
My progress 

I am running the CodeAcademy courses on JavaScript, HTML & CSS and jQuery. Although I started using these technologies some time ago, it was good to neaten my knowledge. I have to admit that JavaScript course starts with basics, so the interesting part started after passing 50% of it :) Here is my current progress right now:

progress








%d bloggers like this: