Загрузить PDF внутри бутстрапа Accordion

Question

Я пытаюсь загрузить некоторые PDFS, которые будут отображаться внутри аккордеона Bootstrap. Проблема в том, что они загружаются по-разному, в зависимости от браузера. Я пытаюсь использовать теги iframe и object html с разными результатами, и у меня огромный поток в Safari, где функция аккордеона полностью ломается, когда я вставляю PDF внутри панели.

Итак, я думаю, мой вопрос: есть ли какой-либо стандарт относительно скрещивания, чтобы сделать встроенную работу PDF в Chrome, Safari, IE11 и Firefox?

Поскольку мне нужно это для работы на мобильных устройствах, ситуация даже хуже. Некоторые советы будут действительно оценены.

Answer 1

Создайте элемент холста с классом «панель-тело» и укажите его по вашему выбору. Затем добавьте следующий код к событию, готовому к документу.

PDFJS.getDocument('YOURPDF.pdf').then(function(pdf) { 
    pdf.getPage(1).then(function(page) { 
     var scale = 1; 
     var viewport = page.getViewport(scale); 
     var canvas = document.getElementById('pdfOne'); // The id of your canvas 
     var context = canvas.getContext('2d'); 
     canvas.height = viewport.height; 
     canvas.width = viewport.width; 
     var renderContext = { 
      canvasContext: context, 
      viewport: viewport 
     }; 
     page.render(renderContext); 
    }); 
}); 

Это будет отображаться на первой странице. Вам нужно будет создать кнопки, позволяющие пользователю перемещаться по документу, но это должно быть достаточно легко, чтобы работать на основе того, что я предоставил, и образцов.