2012-01-10 10 views
5

ho Fancybox impostato in modo che quando un utente fa clic su un link pdf visualizza il pdf in un pop-up, ma in Firefox chiede se si desidera salvare o aprire il file e io don' voglio questo Come posso forzare la visualizzazione del pdf nel popup di fancybox? Funziona in Safari.Fancybox problema PDF in Firefox

<a class="pdf" href="http://www.test.co.u.uk/test.pdf">test.pdf</a> 

$(".pdf").fancybox({ 
    'width' : '700', 
    'height' : '700', 
    'autoScale' : true, 
    'transitionIn' : 'none', 
    'transitionOut' : 'none', 
    'type' : 'iframe' 
}); 

risposta

2

Personalmente, vorrei solo usare Google Docs per visualizzare la PDF in un iframe. Ridimensiona automaticamente il PDF in modo che corrisponda alle dimensioni iframe. Ecco il formato da utilizzare:

<iframe src="http://docs.google.com/gview?url=http://samplepdf.com/sample.pdf&embedded=true" style="width:100%; height:100%;" frameborder="0"></iframe> 

Non hai bisogno di flash o altri plugin.

+0

funziona solo su un URL pubblicamente visibile – rbp

0

Vorrei convertire il file PDF in HTML o provare a trasformare il PDF in un'immagine.

ho avuto questo problema, ma non ero in grado di modificare le impostazioni mio server per visualizzare i file PDF invece di richiesta di conferma per il download.

C'è anche differenze tra i browser il loro modo di leggere i file PDF.

0

A meno che l'utente ha una linea plug-in che rende PDF installato, il PDF non sarà il rendering in Firefox. Non è un formato supportato da Firefox in questo momento.

0

Molto probabilmente, non avete installato in Firefox o il plugin appena si è schiantato il plugin pdf.

In Firefox, andare a Tools ->Add-ons ->Plugins e cercare il plug-in Adobe Acrobat PDF nell'elenco. Se non ci sono, check this per sapere come installarlo (o reinstallarlo).

Inoltre, c'è un modo migliore per aprire i file PDF con fancybox diverso iframe, quindi per questo html:

<a class="pdf" href="http://www.test.co.u.uk/test.pdf">test.pdf</a> 

è possibile utilizzare questo 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 

ho consigliato questo metodo per Fancybox La versione 1.3.x poiché May 2010

Si prega di notare che ho impostato height = "99%". Se si utilizza HTML5 DCTYPE, si evita una doppia barra di scorrimento verticale. Questo perché HTML5 inizializza i margini.

UPDATE. BTW, valori interi andare senza qoutes così

'width' : '700', 
'height' : '700', 

dovrebbe essere

'width' : 700, 
'height' : 700, 

Essa vi consente di risparmiare qualche mal di testa, per lo più con IE