For fancybox v1.3.x having this HTML:
<a class="pdf" href="sample.pdf">open pdf file</a>
use this script:
$(document).ready(function() { $(".pdf").click(function() { $.fancybox({ 'width': '70%', // or whatever 'height': '90%', 'autoDimensions': false, 'content': '<embed src="'+this.href+'#nameddest=self&page=1&view=FitH,0&zoom=80,0,0" type="application/pdf" height="99%" width="100%" />', 'onClosed': function() { $("#fancybox-inner").empty(); } }); return false; }); // pdf }); // ready
Of course, make sure you download jQuery and fancybox js and css files first
Note that I set height = "99%" to the <embed> . If you use HTML5 DCTYPE, this avoids the double vertical scrollbar. This is because HTML5 initializes the fields.
For fancybox v2.x : if you use fancybox v2.x, you can use the same script, but you do not need the onClosed parameter, so delete
'onClosed': function() { $("#fancybox-inner").empty(); }
from the script and the last test comma after the content option.
Also change the word autoDimensions to autoSize .