HTML5 canvas – Image zoomer
New interesting tutorial – I will show you how you can create nice and easy Image zoomer using HTML5. Main idea – to draw a picture on the canvas, add event handlers to mousemove, mousedown and mouseup (to move the enlarged area of ??the motion while holding the mouse).
READ MORE »
Posts tagged image
Creating an Image Zoomer in HTML5 Canvas
Creating HTML5 Image Effects App – Adding Horizontal Flip
HTML5 Image Effects App – Adding Horizontal Flip
Today we going to continue HTML5 canvas examples, I hope you enjoy this series of articles. Even for me, working with graphics, images brings pleasure. Sure that you like this too. Today we will be adding new filter – Horizontal Flip.
READ MORE »
HTML5 Image Effects App – Adding Noise and Invert
HTML5 Image Effects App – Adding Noise and Invert
Today we continue HTML5 canvas examples, I hope you enjoy this series of articles. Even for me, working with graphics, images brings pleasure. Sure that and for you too. Today we will be adding two new filters – Noise and Invert.
READ MORE »
HTML5 Canvas Image Effects App – Adding Blur
HTML5 Canvas Image Effects App – Adding Blur
Today we continue HTML5 canvas examples, hope that you remember application which we made quite 2 weeks ago? Sure that this was very interesting to you to investigate image processing functions. Today I decided to continue and added new filter here – Blur.
READ MORE »
Creating an Unbelievable HTML5 Canvas App for Online Image Enhancements
HTML5 Canvas Image Effects App
Today we continue HTML5 canvas examples, I sure that this still interesting to you. Today we will make application to adjust image colors (Changing photo colors / Grayscale). We will able to make photo darker, lighter, change density of each channel (RGB), make image grayscale (and still able to play with colors).
READ MORE »
How to Create a Photo Album with Highslide
How to create photo album with highslide
During browsing web – I noticed one interesting library – highslide. This is not flash gallery as usual – but DHTML. Which mean that this is very customizable to anybody. Today I will show you how you can implement this library to create own photo gallery, and even several galleries at same page. This library not require jQuery, and its small in same time – so this is great. This is similar as lightbox (I made review long time ago) – very powerful too.
READ MORE »
Creating a FlashMo Mega Grid Image Gallery
Creating Mega grid image gallery
Today we will continue overviews of available flash galleries. Next gallery will Flashmo 249 Mega Grid. This gallery display grid of images from left to right. Here are also horizontal scroll bar. Also we can set custom params like thumb size, thumb gap, photo border size, black/white for thumbs, descriptions etc. This gallery have light weight (about 35kb). Also we have possibility to have customized image descriptions too (using tags: A, P, SPAN etc).
One of the important features of this Mega Grid gallery – possibility to obtain necessary gallery info through PHP file (as xml source of used images). It will allow us to generate different sets of images (in case if this is as Mega Grids of different members as example). Interesting?
READ MORE »
How to Resize images on Server Side

How to Resize images on Server Side
I found this amazing small little image resizing code which will resize and display images quickly. All resizing i done on server side. Original Source
“The code uses PHP to resize an image (currently only jpeg). Using this method, the resized image is of much better quality than a browser-side resizing. The file size of the new downsized image is also smaller (quicker to download).
The code comes in two parts:
- imageResizer() is used to process the image
- loadimage() inserts the image url in a simpler format”
Cross-browser Supported Image Skew effect using Javascript
Cross-browser image shaking effect using javascript
Today’s lesson quite entertaining, we’ll learn how to construct a shaking effect. For clarity, we will apply this effect to the picture. You will need to hold down by mouse a certain area in the image and move it to another location (drag). Now, I sure that better to see our online demonstration. How did it achieve? In principle, simply enough, the entire ‘image’ divided into 4 sectors. Place, where we will begin to drag by mouse – is the boundary separating of our four pictures. And shaking effect itself – will only change the sizes of our sectors and pictures in them. Read more.
READ MORE »
Creating photo gallery using jQuery and VisualLightBox

Creating photo gallery using jQuery and VisualLightBox
Today I will tell you about one useful JQuery plugin – VisualLightBox.
This plugin can help you to create good-looking galleries. And this is very easy to implement.
READ MORE »
