esedic
6/7/2014 - 8:09 AM

Display PDF in-page without a javascript plugin

Display PDF in-page without a javascript plugin

/**
 * When browser supports inline pdfs
 * There is no need to append a large jquery plugin that displays them inline.
 * 
 * You can actually use an iframe (and style it appropriately)
 * or a link whenever inline PDF viewing is not supported
 * 
 * This function is fairly simple and it's only for demo purposes
 */
function appendPdf(id, url) {
    var $el = $('#'+id);
    // Check whether the browser supports displaying pdf files inline (ie. without downloading them)
    if (navigator && navigator.mimeTypes && navigator.mimeTypes['application/pdf']) {
        // You may add extra attributes (eg. to allow transparency) or style the iframe
        $el.html('<iframe src="'+url+'"></iframe>');
    } else {
        $el.html('<a href="'+url+'">Download file</a>');
    }
 }


/**
 * If you need a really lightweight solution and you don't mind
 * if the users with browsers that don't support PDF viewing, 
 * don't view the document, here's a snippet you may use
 */