Javascript

Create Thumbnail Images Easily with jQuery NailThumb

Written by Kevin Liew on 27 Apr 2012
17,174 Views • Shares
2 comments

Introduction

jQuery NailThumb is a client-side image thumbnail resizer. Based on my understanding, the image file size should be the same but this script able to create thumbnail easily from high-res images, without any distortion, with one line of code. The dimension can be decided in CSS and it integrated perfectly with any media gallery, even more useful in dynamic web application when you face any shape or size.

Features

  • Support crop, resize, position
  • Dsiplay image title with animation
  • Preload images
  • Integrated with jQuery Metadata Plugin that allows you to specify metadata directly in your markup and reuse them via javascript
  • Built in methods for customization

Screen shots

Join the discussion

Comments will be moderated and rel="nofollow" will be added to all links. You can wrap your coding with [code][/code] to make use of built-in syntax highlighter.

2 comments
Oshane 3 years ago
Imagine you have 50 high resolution image that is loaded on the site.. does this method reduced the fetching of those files
Reply
Kevin Admin 3 years ago
I don't think so. This isn't the real "resize" and "cropping". You would need server side script to do it. For example, timthumb: https://code.google.com/p/timthumb/
Reply