i just redesigned my site (with a ton of help from many people on this forum--thank you nancy riki osgood
i have my thumbnails resizing (using max width: 100%) in a gallery but on a large browser window like my 32" monitor they get pixelated when they scale up, particularly the text..
is there a way to start with a higher resolution image and display them at a smaller display size so when they scale up they stay crisp?
go to REEL, MORE and NEWS
Hello mate, Welcome back!
Ideally, I wouldn't do a 100% width for your images on the site for enlarging them. No matter what plug-in you use, you'll definitely end up pixelating the image at least to some extent.
However, if you're definitely looking at achieving this, try this: http://archive.plugins.jquery.com/project/aeImageResize
And, start with a higher resolution of the image. The plug-in will scale it down proportionately depending on the screen dimension you're displaying it on, rather the DIV dimension that holds the image inside.
Also, it is to be noted that usage of multiple jQuery will lead to a performance issue on your site. You should keep this in mind.
One last thing: having said that you should start with a higher image resolution, your load time for the site will considerably increase as the plug-in only scales down the image visually, it doesn't load differently sized images!
If I were you, I'll keep the thumbnail images to zoom in to one optimal size and then provide a link inside my fancybox/ lightbox to a much fuller, bigger size image - if someone is interested in seeing them/ downloading the big size image.
Europe, Middle East and Africa