Image protection is a hot topic on the net these days, and why shouldn’t it be? If you spent two hours designing an awesome graphic, would you want it ripped of in matter of seconds? Hell no! That’s why I’ve created an image protector class to help designers and artists protect their images. Here’s how it helps:

• Prevents right-click “Save Image As”.
• Prevents dragging an image to the desktop.
• Prevents right-click “Save Background As”.
• Prevents right-click “View Background Image”

All I needed was a small MooTools script.
JavaScript

//protector class
var dwProtector = new Class({

	//implements
	Implements: [Options],

	//options
	options: {
		image: 'blank.gif',
		elements: 'img',
		zIndex: 10
	},

	//initialization
	initialize: function(options) {
		//set options
		this.setOptions(options);
		this.options.elements = $$(this.options.elements);
		//make it happen
		this.protect();
	},

	//a method that does whatever you want
	protect: function() {
		//for each image that needs be protected...
		this.options.elements.each(function(el) {
			//get the element's position, width, and height
			var size = el.getCoordinates();
			//create the protector
			var p = new Element('img', {
				src: this.options.image,
				width: size.width,
				height: size.height,
				styles: {
					'z-index': this.options.zIndex,
					'left': size.left + 'px',
					'top': size.top + 'px',
					'position': 'absolute'
				}
			}).inject($(document.body),'top');
		},this);

	}
});

The class is so simple it has only one working method! The protect() method places the “blank” image over the image you need to protect.
The Usage

window.addEvent('domready', function() {
	var protector = new dwProtector({
		image: '/blank.gif',
		elements: $$('.protect')
	});
});

Demo: http://davidwalsh.name/dw-content/image-protector.php

Download: http://davidwalsh.name/dw-content/dwProtect.js

Source: http://davidwalsh.name/mootools-image-protector-dwprotector

Related Listings:

1. Delayed Image Loader Script for Prototype lazierLoad is Bramus! his take at writing a delayed javascript...
2. TripTracker Lightbox Image Script The TripTracker slideshow is a lightweight JavaScript image viewer with...
3. ElementFilter – Moo Tools Plugin My new MooTools plugin, ElementFilter, provides a great way for...
4. Pamoorama – Image Moo tools plugin Pamoorama is a simple script that aims at spicing up...
5. Onload Image Fades Script A function to show an ‘image loading…’ message and subsequent...

Do you like this post?

Email: