1. Følg med
  2. Blog
  3. 2010
  • Publisert
  • 1 min

FancyBox tips

<p>I had some troubles getting my FancyBox implementation working in IE8, so to save you from spending time Googling, I'll share two tips here.</p>

Av Lars Øyvind Bodahl

I have a list of images where I've attached a FancyBox lightbox so the users can click and get a larger preview.

My FancyBox were working fine in FireFox, but when I tried it in IE8, it only worked for the first element on the page. After reading the FAQ  I solved this problem by:
Tip 1:
Use class as a selector, not id. Meaning: Use $(".selector").fancybox() instead of $("#selector").fancybox()

But, by solving that problem, I got a new problem: The images were not displayed correctly. They were displayed as unreadable signs. After googling some more, I found the solution:
Tip 2:
Set the content type. I'm displaying images, so by setting the type to image everything works just fine :)

$("a.fancyboxImg").fancybox({
    'type': 'image'           
});