Go Back

Add a Hover Zoom Effect to Sitefinity Thumbnails

Pick up that can.

Telerik’s Sitefinity CMS includes a media management module.  This module can be use to upload and organize images, documents, videos and miscellaneous files.  Once a set of images is uploaded, Sitefinity can automatically generate an image gallery and thumbnails based on these uploaded images.

In addition, images can be linked to specific content items (for example, news, events, blogs, etc).  Once an image is linked with a content item, Sitefinity can associate thumbnails when the content  item is linked.  (Example: displaying thumbnails for news items.)

Scott Rozman recently published a blog post describing how he added some visual flair to these thumbnails using the jQuery Fancy Thumbnail Hover Effect (click here for a demo).

Here is a quote from Scott’s blog post:

For a little extra visual fun, I've added some jQuery to create a zoom animation when you hover on the thumbnails. If you are interested in a news item, but can't see details of the photo well enough in the 50x50 resolution, now you can roll over the thumbnail and it animates larger until you roll away from it.

Click here to read the full blog post.

Thanks Scott for writing this blog post!

Post a comment!
  1. Formatting options
       
     
     
     
     
       
  2. I'm sorry for the CAPTCHA. You have spammers to thank for this: