Add image zooms to sites using PopBox
Laura James shows you how to use the free PopBox JavaScript library to add a zoom function to products on an online site.
When a customer browses for products online, it's important that they can see as much detail as they would if they were picking up the item in a shop. Therefore, most e-commerce websites can benefit from some sort of zooming.
The PopBox JavaScript function is a free library from C6 Software that enables you to add a zoom facility to your product thumbnails with very little effort. The library is robust, lightweight and doesn't navigate away from the page or create new windows. Twosevenzero has used it to great effect in a funky site for design boutique Nora Does, which you can see at www.noradoes.co.uk. I'll show you the basic implementation here, but there are many other attributes you can tweak to get it to perform all sorts of magic tricks. The developer of the PopBox library, John Reid, provides extensive documentation online, and this should be your next stop: www.c6software.com/Products/PopBox/documentation.aspx.
Click here to download the support files (462KB)
Click here to download the tutorial for free
Get the Creative Bloq Newsletter
Daily design news, reviews, how-tos and more, as picked by the editors.
Thank you for reading 5 articles this month* Join now for unlimited access
Enjoy your first month for just £1 / $1 / €1
*Read 5 free articles per month without a subscription
Join now for unlimited access
Try first month for just £1 / $1 / €1
The Creative Bloq team is made up of a group of design fans, and has changed and evolved since Creative Bloq began back in 2012. The current website team consists of eight full-time members of staff: Editor Georgia Coggan, Deputy Editor Rosie Hilder, Ecommerce Editor Beren Neale, Senior News Editor Daniel Piper, Editor, Digital Art and 3D Ian Dean, Tech Reviews Editor Erlingur Einarsson and Ecommerce Writer Beth Nicholls and Staff Writer Natalie Fear, as well as a roster of freelancers from around the world. The 3D World and ImagineFX magazine teams also pitch in, ensuring that content from 3D World and ImagineFX is represented on Creative Bloq.
Related articles
- How to use Cosmos: a beginner's guide to the viral social media platform made for creatives
- How to plan and paint vibrant video game poster art: Duncan Fegredo shares his pro workflow
- How to make an atmospheric lunar creation in After Effects with Red Giant VFX plugins
- How to create a realistic peppermint candy material in Blender