2016-10-14 3 views
1

У меня есть веб-страница, которая показывает мне несколько ранее загруженных файлов, но я хочу, чтобы, щелкнув по их ссылке, откройте ее в названный div.Открыть pdf-файл, встроенный в div

Мой код:

<div class='row'> 
    <div class='col'> 
    <a href='pdf1.pdf'>pdf1</a> 
    <br/> 
    <a href='pdf2.pdf'>pdf2</a> 
    </div> 
    <div class='col' id='preview'>OPEN PDF PREVIEW</div> 
</div> 

Если я нажимаю на «PDF1» или «PDF2» мои два файла могут открыть в DIV с идентификатором PREVIEW

Я попытался с некоторыми функциями Jquery, без удачи ,

+0

Вы используете jquery? для 'id = 'preview''? PLZ доля – devpro

ответ

1

можно сделать следующим образом:

<iframe src="http://docs.google.com/gview?url=http://example.com/mypdf.pdf&embedded=true" style="width:718px; height:700px;" frameborder="0"></iframe> 

вы просто должны пройти свой путь в формате PDF к URL

+0

с вашим решением это работает, но мне нужно немного вещей, чтобы сделать его лучше. – maures

+0

1) с фиксированной высотой и шириной, моя страница растягивается из-за iframe. есть способ сделать iframe «невидимым» и расширить его размеры, когда я нажимаю на ссылку? 2) Я хочу использовать jquery «toggle», чтобы он исчез, когда я нажму второй раз. возможно? – maures

+0

ok Отлично, если он работает для вас, то вы можете его перенести и можете принять это как ответ –

0

Если вы хотите открыть ссылку в IFRAME, попробуйте использовать целевой = «iframeName» , как видно на W3C.

+0

В сочетании с ответом Insomania попробуйте следующее: a href = "http://docs.google.com/gview?url = http: //example.com/mypdf.pdf&embedded=true "target =" preview ", где у вас есть iframe с именем« preview » – OlajosCs

+0

Я объединил его с решением insomania, спасибо! – maures

Смежные вопросы