Using a text only editor like NotePad, in the multizoom.css file, near the top, add the highlighted as shown:
Code:
.magnifyarea { /* CSS to add shadow to magnified image. Optional */
box-shadow: 5px 5px 7px #818181;
-webkit-box-shadow: 5px 5px 7px #818181;
-moz-box-shadow: 5px 5px 7px #818181;
filter: progid:DXImageTransform.Microsoft.dropShadow(color=#818181, offX=5, offY=5, positive=true);
background: white;
position: fixed !important;
top: 350px !important;
}
Requires IE 7 or later, or any other modern browser.
You may or may not want to adjust the top coordinate. Just keep in mind that some user's windows will not be as tall as others, and you don't want the magnify area to be so far down in the window that it cannot be fully seen, or perhaps not even be seen at all.
jQuery could be used to set the top coordinate at half the user's window height minus half the height of the magnify area. It would have to update on window resize as well. If you're interested in that, let me know.
Also keep in mind that if you set variable zoom, or the mouse wheel disabled options, it will be difficult for the user to scroll the page while viewing the magnified image.
Bookmarks