CODEWITHSUNDEEP
jqueryfancybox
Dusan Novakovic
Dusan Novakovic

Reputation: 11

jQuery - Fancybox with iframe

I'm using Fancybox with iframes to load PDF files from database in it. The main idea is that on normal page I have table with content and every row contains field "show invoice", example:

No | Title | PDF file | Action

1. | invoice 1 | show inovice| edit

2. | invoice 2 | show inovice| edit

  1. | invoice 3 | show inovice| edit

Now, let say that "show invoice" are links:

... ...

So, clicking on link I'll end up on page where my PDF file(s) will be loaded, but I wanted to have those PDF files in FancyBox with arrows left and right. I managed to connect everything ok, but I can't force FancyBox to show arrows left and right, so that I would be able to show other PDF files, one after another.

Any idea, suggestions or so?

And, this is the way I call fancybox (of course, I linked jQuery and funcybox on the top): 

$(document).ready(function(){
 $(".iframe").fancybox({

    'transitionOut' :'elastic',
    'speedIn'  :600, 
    'speedOut'  :200, 
    'width'  :1020,
    'height'  :1000,
    'titleShow'  :false,
    'hideOnOverlayClick':false,
    'hideOnContentClick':false
 });
});

Upvotes: 1

Views: 3080

Answers (1)

seanmetzgar
seanmetzgar

Reputation: 164

Fancybox doesn't care what method it's using, just make sure you place the same rel attribute on all of your links that you want in the same gallery (i.e. rel="pdfGallery", rel="imgGallery").

On a side note... If you're using ?iframe in your links to trigger the iframe type of fancybox, remove that and add 'type':'iframe' as the last option in your fancybox settings. It will make your javascript more efficient.

Upvotes: 1

Related Questions