Protecting images online is a difficult, almost impossible, mission to accomplish. At the end, the image is there and a "print screenshot" command can grab it & no way to stop this.

But, there are various ways to harden the process & make it not worth trying like disabling right clicks, using images as backgrounds, adding watermarks to them & more.

Here are the good practices of these options:

Hide The Images

Put A Blank File Over The Real Image

This method will make the real image unreachable unless checked from the source.

You can use the original image as a background & put a transparent-blank file over it that matches the size of the real image.

For ex:

<div id="image1" style="background-image: url(originalImage.jpg);">
    <img src="blank.gif" height="250px" width="300px">
</div>

So, when the image is right-clicked, it will be the blank.gif that can be reached.

There are also 2 JavaScript framework ready solutions for this:

• dwProtector for MooTools
• dwProtector for jQuery

Read the rest of this entry »

Agile Carousel is a feature-rich jQuery plugin for creating attractive image sliders.

With a bunch of options to customize the slider, and it can be used with or without jQuery UI for more effects, the plugin provides total control.

From a folder mentioned, it gets the images via PHP (not Ajaxed).

Some controls it has are:

• Prev-next button options
• Enable-disable slide captions
• Effects used, delays
• Use of watermarks (text)
• & many more..

A demo with all the features can be found here.

Image processing is needed in almost every web application like creating watermarks, uploading & resizing avatars, cropping them & similar tasks.

Asido is a feature-rich image processing class for PHP that fits to any environment like GD2, Magick Wand and Image Magick. It supports both PHP4 & PHP5 (newer versions support only PHP5).

An example of adding a watermark to an image:

And the code:

<?php
include('./../../asido/dev/class.asido.php');
asido::driver('gd');
$i1 = asido::image(
      'the-source-image.jpg',
      'filename-with-which-you-want-to-save-the-result.png'
);
asido::watermark($i1, 'put-the-watermark-image-here.png');
$i1->save(ASIDO_OVERWRITE_ENABLED);
?>

It is really simple and clear.

Asido can:

• resize
• watermark
• rotate
• copy
• crop
• grayscale
• convert

images with ease. To develop faster, Asido is worth a try.