image zoom not clear (fuzzy)

GK User
Wed Dec 03, 2014 10:58 am
Hello guys

i have the problem, that the zoom opportunity in the product details are very pixelated (fuzzy) if i go on the image. I take unother resolution for 1205 x 1500 px and it uploaded also. but this don't change it. i think it takes the thumbnail from 258x321 px put this is very pixelated.

link:
http://www.uhren-outlet.at/component/hi ... temid=9999

could somebody helb me
thx
User avatar
Fresh Boarder

teitbite
Thu Dec 04, 2014 4:19 pm
Hi

Please unlock website for Poland. This is all I can see right now:



403: Access Forbidden

Your location (PL) has been blacklisted.
User avatar
Moderator

GK User
Sun Dec 07, 2014 11:45 pm
Hi just bought this template and I'm having the same problem product zoom hover image blurry (specially over photo tile copper insole) searched all around and tried (almost everything)with no lucky :unsure: help pls. site www.drcopper.us
User avatar
Fresh Boarder

GK User
Mon Dec 08, 2014 4:11 am
Yes, agreed. Zoomed product images are pixelated and unfortunately do not look very professional. A pity because otherwise the template overrides are fantastic. The zoom effect would be great too if it was clear.

You can check your own Hikashop demo here (hover over the product for zoom) to see what we're talking about:
http://demo.gavick.com/joomla25/storefr ... ite-jacket

Now check the zoomed image quality of the premium Magic Zoom extension which does the same thing - only much better:
https://www.magictoolbox.com/magiczoom/ ... /hikashop/

It appears that the Gavick zoom is based on the thumbnailed image rather than the original (large) uploaded image? Just increasing the size of an image x 3 times is obviously going to pixelate. Would be nice to see the zoom based on the original uploaded product image.

I presume the Gavick zoom is controlled by the "Magic Zoom selectors" section at line 236 of gk.scripts.js in the template's js folder? I managed to change the size of the zoom but of course you have to reduce zoom to 1:1 to remove the pixelation, which completely defeats the purpose of a zoom. Unfortunately, my javascript skills are inadequate to work out the correct way to go about it.

Any ideas how to get the Gavick zoom to show clear unpixelated zoomed images like the Magic Zoom Joomla extension? Thanks.
User avatar
Junior Boarder

teitbite
Mon Dec 08, 2014 5:06 pm
Hi

You are correct. It's using the same image, but this means that configuring thumb to be much bigger will result in thumbs being resized by a css, but a zoom image will be much bigger and not blurry than. This is a workaround till I'll come up with a solid solution. Reporting this to programmers.
User avatar
Moderator

GK User
Mon Dec 08, 2014 11:24 pm
Thanks for the reply Teitbite.

Unfortunately, your workaround of configuring Hikashop for large thumbnails makes no difference to the clarity of the zoom.

I have configured and loaded thumbnails @ 750px x 1000px but the rollover zoom is still pixelated.

Product page images are configured for 375px x 500px and they are crisp and clear. It looks as though it is the product page image that is being used for zoom, rather than the original 750 x 1000 image.

Enlarged product images (when you click on the product page image) are crisp and clear and displayed at 750 x 1000. It is just the zoom that lets the whole thing down.

Thanks for the report to programmers but possibly better off without the zoom at the moment as it really detracts from an otherwise great template override.

PS: I see this exact issue has been mentioned MANY times on other Storefront forum threads with no definitive answer yet? It also gets a mention on the Hikashop forum where it is passed back to the template developer for a fix.
http://www.hikashop.com/support/forum/p ... mages.html
http://www.hikashop.com/forum/product-c ... oming.html
User avatar
Junior Boarder

teitbite
Wed Dec 10, 2014 11:10 am
Hi

Thanks for this links. I'll include it in the report. Hopefully it will speed things up.
User avatar
Moderator

teitbite
Tue Dec 16, 2014 7:36 pm
Hi

Fix is ready.

Please replace 2 files:
- gk_storefront/html/com_hikashop/product/show_block_img.php
- gk_storefront/js/gk.scripts.js

with the ones attached.
User avatar
Moderator

GK User
Wed Dec 17, 2014 1:01 am
Thanks Teitbite, excellent Gavick service as always. Much appreciated.

The fix is definitely a major improvement and good enough for production use....

....but there is still some pixelation due to the scaling of the zoomed preview image? I would think that 1:1 scaling (100%) of the large uploaded thumbnail would be the only way to prevent pixelation on a zoom. This doesn't seem to happen and the zoomed preview is being scaled to larger than the original. There is a 25% increase in the zoom preview image over the original uploaded image.

Example: Uploaded product image is 750px x 1000px. In Hikashop - Image width/height and Thumnail width height are set to 750 x 1000. Product image width is set to 375 x 500. Force image size = Yes and Keep ratio = yes. So frontend product images and thumbs are all scaled correctly, correct aspect ratio and are crisp & clear. Perfect!

The zoomed image however takes the original uploaded thumbnail (750px X 1000px) and scales it to be 938px X 1250px? It is adding 25% increase to the original image size. So it is still slightly pixelated (good enough - just not perfect ;) ). I would think that 1:1 zoom on the original uploaded image would be ideal?

I can see that the zoomed preview image is now correctly taking the original uploaded image (media/com_hikashop/upload/image.jpg) to apply the zoom rather zooming than the resized product image. Any idea how to now set the zoom to be 1:1 rather than 1.25:1? I had a play around with the zoom function in gk.scripts.js but unfortunately I just can't work it out. Thanks.

PS: I don't mean to be a nuisance and the new zoom script is actually good enough to use for most general products but if you were wanting to zoom intricate hi-res images (like this example: https://www.magictoolbox.com/magiczoom/modules/hikashop), it would detract for the otherwise excellent template you've produced.
User avatar
Junior Boarder

teitbite
Fri Dec 19, 2014 6:47 pm
Hi

I'll pass this comment to programmers. Will let You know what they answered.
User avatar
Moderator

teitbite
Mon Dec 22, 2014 3:36 pm
Hi

Ok. Programmers added this option already in Featured, but called in "VirtueMart zoom area size" by accident. It will be corrected soon.
User avatar
Moderator


cron