Posted by fivehimself on June 23, 2009 at 5:53am
Jump to:
| Project: | FancyZoom |
| Version: | 6.x-1.4 |
| Component: | Code |
| Category: | support request |
| Priority: | normal |
| Assigned: | thinkyhead |
| Status: | fixed |
Issue Summary
Hi, I really like this zoom and would like to use it on my site.
I've created a custom content type with multiple IMCE Image fields. The fields are shown as a thumbnail and when you click on it, the fancyzoom loads the full image. This works just fine, only when the images have different ratios there's a problem.
The second image loads with the width and height of the first image.
This is the code I'm using to display the IMCE Image Fields for Fancyzoom:
<div class="crop-150x100">
<a href="<?php print $node->field_image1[0]['imceimage_path'] ?>">
<img src="<?php print $node->field_image1[0]['imceimage_path'] ?>" />
</a>
</div>
<div class="crop-150x100">
<a href="<?php print $node->field_image2[0]['imceimage_path'] ?>">
<img src="<?php print $node->field_image2[0]['imceimage_path'] ?>" />
</a>
</div>The .crop-150x100 class is a quick and dirty way to use the same image as a thumbnail:
.crop-150x100 {
margin-top: 3px;
height: 100px;
width: 150px;
overflow: hidden;
}Does anyone have this same problem with fancyzoom? I call my scripts at the end of the page, not in the header.
I hope someone could help me with this one.
Comments
#1
To bad, but skipping this module / plugin due to this problem... If someone has a resolution, I would still be verry happy. Untill that time, I'll be using lighbox.
#2
Have to see if this affects multiple images in other scenarios as well. Probably an issue with the FancyZoom javascript doing bad overloading...
#3
I'd like to see an example of this so I can see the problem in action.
#4
Sorry for the late reply. Don't have a live install somewhere to show... Needed to speed up my project, so went with a different module.
#5
I'm experiencing this problem at the bottom of this page:
http://labjack.com/support/clouddot/labview
All the thumbnails are the same width (270px), but different heights. If you click on all four thumbnails, they will all become the same width, either 556px or 482px, depending on which one you click on first.
Does this help?
#6
Confirming this behaviour when using 'jQuery Minimized' or 'JQuery' script.
But when using 'Standard Minimized' script it seems to work fine.
#7
Thanks for the tip, Argus. I switched the link in #5 to use "Standard Minimized", and it does seem to be working fine. I'll switch it back to "jQuery Minimized" by request if it helps in debugging.
#8
@ #7 that solved it for me as well. Thanks
#9
Hint : this bug occurs in a cached version of the site, not when I am logged.
It therefore seems that Drupal caching confused or bypasses a part of Fancyzoom.
BUT, on the other hand, I confirm that by DE-selecting Use Minimized Javascript, the bug stops. Therefore, it's logically the cache related to minimized javascript that conflicts...
#10
That's a good tip, I'll check that out. I need to publish updates to some other modules as well before the year is out.
FancyBox? That one looks pretty nice.
#11
This is probably better now. Get the latest FancyZoom Javascript tarball from http://www.thinkyhead.com/design/fancyzoom and give it a try. The key was to use
.bind("mouseover", ...)instead of.one("mouseover", ...)so that the image pre-loads every time you mouse over an image instead of just the first time.