Nice blog you have, I'm a regular "costumer" hehe.

Btw, have fun at Roskilde! I know I would! :)

MojoZoom is almost perfect !
Many thanks it is really a usefull script.

A strange behavior with several pictures reported with FF2/IE6 : it's possible to move really fast the mouse and the onmouseout event seems not to be taken into account : the zoomed image remains displayed. This may disturbing if several zoom areas are overlying.

I will report a workaround if I make one (I guess hidding all zoom areas when displaying a new one should do the trick).

Ok, I'll have a look at that and see if I can find the cause. Thanks for the bug report!

Works Great!
However, does have the same issue mentioned above:
"it's possible to move really fast the mouse and the onmouseout event seems not to be taken into account : the zoomed image remains displayed."

Ok, I'll see what I can do. Totally forgot about this, sorry.

Hi, MojoZoom is realy great. But it somehow crashes in ie7 on load. I tested it on an other computer, but the same problem.. I have to restart ie every time. ff works good.

Also I wanted to ask if it's possible to directly show the div element and the zoomed image in it on load. Without doing a mouse over. And that it also remains visible after mouse out.

Tia,
Kees (The Netherlands)

Hmm, I'm not able to reproduce any crash in IE. Does it just crash straight to desktop without any (meaningful) error?

I'm working on an update right now, I'll include an option to always have the high res image portion shown.

No I get no errors.. IE just stucks (i hope i say this right). I have to kill ieexplorer.exe. But i'll test it again later this evening.

And an other question; how can I remove/switch off the link on the image, i coudn't find anything about that..

Tia,
Kees (sorry for my pour english btw).

Ok, please do. It works just fine here.

You can't really remove the link, but you can wrap the image in a link manually in the HTML and then make the link do nothing, ie. <a href="#" onclick="javascript:void(0);" ...
Then the script won't add its own link.

Maybe that'll work?

Ok, I've posted an update that adresses some of these issues.
http://blog.nihilogic.dk/2008/10/mojozoom-and-mojomagnify-updates.html

Hey guys thanks very much for this i am glad that this is not for non profit and doesn't cost commercial users i only have ads on my website i do not know if having ads on websites is considered as being commercial website. the ads are used only to pay hosting bills :(

Hi! Mojozoom works great, but just one question: Can you make it to do multiple zoom? how?

Hi,
Its really nice and helpful me. Thank for sharing. i m very happy to use this.

I just found it yesterday... and think it's unbelievable!
Would there be a way to add a title or caption? Or a circle instead of a square, I think I like the square more but just thinking out loud... I'm amazed, it's drop dead easy and works like nobodies business!

LASA

@LASA: I'm glad you like it :-)

No title/caption, where would you want it added? Only rectangles are supported, you would have to use something like WebKit's CSS masks to get circles or other shapes.

Awesome script-- even big companies like Anthropologie use it--

I'm having an issue though. I've got a shirt image and the color chart right next to it; the chart (only 40px wide) gets kicked to the bottom of the page when I include Mojozoom, which otherwise works fantastically. I'm trying to get the zoom overlay to float over/beside the chart.

Also, how do you remove the border on the image-- can't find it in either the css or js file (only zoom border). I can provide code, just didn't cant to clog up space here: email: sgriebel at vt.edu thanks man

Cool, always nice to see it in use :-)

If you email me (jseidelin@nihilogic.dk) with a link or a complete set of files, I'll take a look when I get the time.

Hi, I have several images on a page that use MojoZoom, paid version. In Firefox all images after the first two only allow user to see the hi-res upon click so the real-time zoom does not work.

Also, there is quite a delay in both IE and FF before the real time zoom works. I imagine this is because the hires pics are big.

Any advice would be appreciated

Please provide a link to a page that exhibits the issue. Also, there is no paid version.

Is there any way to change the amount it zooms in? Great tool by the way. Literally took my 10 seconds to add it to my Magento ecommerce site. Thanks!

That's determined by the dimensions of the image you specify as the zoom image.

Oh got it, thank you. So does this tool actually do any zooming or does it just show the larger image? Both are fine for my project, I am just wondering.

Yes, it just shows the larger image in a small "window" on top of the image.

Awesome. Thats probably a much better way than trying to use javascript to enlarge it. Great tool.

What a terrific script. There are so many image zoom scripts out there, not all of them free, and none of them are as flexible or as cleanly coded as this one. I'm in the process of learning JavaScript and this has taught me a lot.

Good work!

is there anyway to turn off automatic turn into link?

I don't know if there is, but the way I dealt with it was to make the href point to #.

I am Nusrat Ali from Pakistan , I really nice script.
I love all or you and your scripts.
thanks

may you want to check this one ?
http://beben-koben.blogspot.com/2009/08/javascript-zoomer-teranyar.html
thanks for share. I am found brand new heres...nice to meet you

Great script! I am creating an online atlas and wonder if it's possible to add the functionality of activating the zoom with a mouse-click or control (or other button) key so that the user can position the zoom in the center of a map then deactivate the function and be able to navigate the mouse for other purposes while viewing the zoomed image. As it is now the user has no choice but to leave the zoom box at the edge of the picture.

Thanks for any help!

@Brian: Well, it's certainly possible to add that functionality, but I'm afraid the development of these scripts has pretty much stopped, except for the occasional bug fix.

The problem with "the chart (only 40px wide) gets kicked to the bottom of the page when I include Mojozoom" can be resolved by changing the line:
linkParent.style.display = "block"; to
linkParent.style.display = "inline";

By the way: i've modified the script to not scroll through images smaller then the specified zoomWidth/Height, to alternativly show the zoomed image left or right from the thumbnail-image depending on wether the thumbnail is on the left or right half of the current window.
Additionally the zoomed-images-position is corrected to always stay in the visible area (with exception of the left and right side).
This modified version can be visited here: /http://www.ib-hoebel.de/index.php?cPath=28_29_32
and downloaded here:
http://www.ib-hoebel.de/includes/mojozoom.js

Just fixed some problems with the mojozoom-script.
On IE the movement of the zoom-image was very bucking. IE seems to be to slow for rendering just in time with the occuring mousemove-events. If've fixed that with not evaluating mousemove-events more often than every 10ms.
Additionally if've removed the mousemove-event attached to document.body because this hack only works with only 1 zoomeable image on the side, not with several images. Instead i've changed the mouseout-event to mouseleave-event on IE and removed the "if (target.nodeName != "DIV") return;". With this the "mousemove"-hack is needed any more.

I am sorry but this may sound really stupid, how do I use Javascript in Blogger? Under Layout/templates, I can only enter XML codes. On posting editors, I can only place HTML codes. Where and how do I use Javascripts in order to use the Mojozoom?

Thanks so much.

I am assembling a cdrom with some 5000 images which I would like to zoom. I am using Javascript but I am not a professional programmer. I downloaded mojozoom.js and mojozoom.css, and I tried a number of things, but I am unable to get it to work. Can someone give me some pointers as to how to set this mojozoom up? Do you call "MojoZoom" or do you do an assignment like "window.href = MojoZoom"? Or put both scripts in a "htm" file and somehow work from there. I am lost. Thanks in advance for any help. Cor van Dijk or

Never mind, I figured it out. Great piece of code.
Cor van Dijk

Hi jacob, any ideas how to have more than 1 zoom image?
with out fliking and problems?

@J:
You can download my modified version on http://www.ib-hoebel.de which fixes the flickering.

Hy Jacob, great job!

I am trying to use it in a web page, but I have some problems: I have a terrible flickering under IE.
Link to my page: http://www.xfect.com/xfectfitshort.htm
Can anybody help? Thank you!

P.S. Also tried the modified version from Heiko, it doesn't work...(nothing happens when I move mouse over a picture)
Regards

Michele

Addendum:
a) If i double click an image, it works.
b) If I enter a picture from the lower right corner, it works...

Hope it helps to find a solution!

Thanks to all of you for sharing and help!

Hi Hidemik, it seems that you've found a solution to your problem because your mojomagnify doesn't have a problem with flickering any more. How did you solve it?

for some reason my zoomed image appears high on the page unless my image is on the top of the page... the image i want o zoom into is in the middle of my page, and the zoomed image appears at the the tip when moused over... its this way i all browsers... how can i fix...

I have some problems with chrome 12 (and maybe safari 4), i changed two lines of the makeZoomable method.

var zoomWidth = zoomImg.naturalWidth ? zoomImg.naturalWidth : zoomImg.offsetWidth;
var zoomHeight = zoomImg.naturalHeight ? zoomImg.naturalHeight : zoomImg.offsetHeight;

Taka a look at my drag and drop puzzle. I'm using mojozoom for offering more details:

http://karate.zeitformat.de/kata/schiebepuzzle/heian_shodan_puzzle/drag_drop_sort_kata_heian_shodan/sorting.html

Hi. This is a very clever script. I was wondering if it is possible to fix the position of the zoom box.
< div class="mojozoom_imgctr" style="left: 541px; top: 0px; width: 250px; height: 250px; overflow: hidden; visibility: visible;">
This is the div that surrounds the image. I can change the size and margin but I want to fix it to far right of the page. Or a fixed left position of 790px will also work for me but I can't figure out what I need to change in the css or js to make it happen.
Any help would be brilliant if anyone knows?

I am trying to use it in a web page, but I have some problems: I have a terrible flickering under IE.Sivilce tedavisi