changing zoom image size

[rayhan]

Hi

I am trying to let clients choose zoom image size, but it is not working well.
When page is loaded, zoom image container is 300 X 300 as default, but once I choose another image (mouse over on thumbnails) to display, it works.
Can anyone advise me where to look at?
Site url is http://shopv2.e-retailer.co.nz/estore/style/bb190&w.aspx.

Thanks in advance

Ray

[rayhan]

I have found workaround.
I added width and size in MagicZoomBigImageCont class like below and replace variables when user save settings.
.MagicZoomBigImageCont {
  border:1px solid #91B817;
  width:@@ZoomImageWidth !important;  /* do not edit this line please */
  height:@@ZoomImageHeight !important; /* do not edit this line please */
}

Does anyone found out other solutions?

[oleksiy]

1. You shouldn't change internal CSS styles because you break zoom. You can see that yourself when you mouseover such images - zoom will go beyond boundaries of the image.

2. You are using very old version of Magic Zoom Plus. Could you please send us your purchase ID using our website contact form? http://www.magictoolbox.com/contact

Zoom window size is controlled by two settings: zoom-width and zoom-height. Change them and the zoom size will change. Your old version doesn't have at least 50% of options that you can see on Magic oom Plus integration page: http://www.magictoolbox.com/magiczoomplus/integration/#parameters

[rayhan]

Hi,

I have just sent you my license key. If it is not purchase ID, let me know. I believe I am using V1.7.
zoom-width and zoom-height is working on the site I provided. I meant when page is loaded(dark gray shirt image is default), zoom-width and zoom-height do not seem to work.
If mouse over dark gray shirt image, zoom image is 300 x 300. (wrong)
But if I choose another thumbnail below dark gray shirt image (standing girl for example), zoom image is 200 x 400.(right)
It only does not work on first image.(dark gray shirt image)
Any ideas?

Regards

Ray

[oleksiy]

I'm sorry but we couldn't understand your problem. This is what I see when I first time load your page and don't click anything: http://img6.imagebanana.com/img/n7ukywkt/Selection_006.png

[rayhan]

Hi,

Because I specified width and height for MagicZoomBigImageCont class.
I have removed width and height. You will see what I meant by now.

http://shopv2.e-retailer.co.nz/Users/shopv2.e-retailer.co.nz/files/300x300%28incorrect%29.png

http://shopv2.e-retailer.co.nz/Users/shopv2.e-retailer.co.nz/files/200x400%28correct%29.png

[oleksiy]

No I don't see what you mean. I've reloaded the page and yes I see the zoom window at 300x300 but I also see that these dimensions are specified in the Magic Zoom Plus invocation code:

Code:

<a id="ImgStyle" href="/Users/shopv2.e-retailer.co.nz/images/122.jpg" class="MagicZoom MagicThumb" title="Billabong T '&quot;\Shark Attack" rel="thumb-change:mouseover; zoom-position:right; show-title:true; zoom-fade:true; zoom-width:300; zoom-height:300; zoom-distance: 15;">
                  <img src="/Users/shopv2.e-retailer.co.nz/images/122_300_300.jpg" alt="Billabong T '&quot;\Shark Attack" title="Billabong T '&quot;\Shark Attack"/>
               </a>

zoom-width:300; zoom-height:300;

So please check your server side code, there is nothing wrong with Magic Zoom Plus here.

[rayhan]

I am sorry that I have changed back to 300x300 this morning to show my directors regarding the changes I made.
Please take a look once more.
It is defined as zoom-width:200 and zoom-height:400, but zoom image is 300 x 300 as scripts below.
 
<a style="position: relative; display: block; outline: 0pt none; text-decoration: none; width: 200px; -moz-user-select: none;" id="ImgStyle"
href="/Users/shopv2.e-retailer.co.nz/images/122.jpg" class="MagicZoom MagicThumb" rel="thumb-change:mouseover; zoom-position:right; show-title:true; zoom-fade:true; zoom-width:200; zoom-height:400; zoom-distance: 15;">
<div class="MagicZoomBigImageCont" style="width: 300px; height: 300px; overflow: hidden; z-index: 100; visibility: visible; position: absolute; top: 0px; left: 217px; display: block;" id="bc806948">

[oleksiy]

Try adding 'px' to width and height settings in the REL attribute, e.g. here: zoom-width: 200 => zoom-width: 200px

This was a requirement in old Magic Zoom Plus (1.7.3).