在我的页面上嵌入电源点演示文稿

Question

In my case,on the client side the user can select (img(jpg|png|gif") file,pdf file,ppt file) and the data is getting stored in the database.Now in admin pannel i have to show this selected files.what i have done is I am using a if condition if file is img than i am using img tag (src =folder containg file /database value ) and for pdf i am using anchor tag hyperlink (href = folder containg file /database value) both are working fine but the problem is with ppt file i did the same as i did for pdf but it is directly downloading the file and i want to show the file only. I don't know how to this i searched for the plugin also , i am not getting anything. I tried to use the iframe and (src =folder containg file /database value )
This is also not working its directly downloading the file

Answer 1

you can use Google Doc viewer for that. It handles all kind of files : jpg, gif, png, doc, docx, xls, xlsx, ppt, pptx, etc...

Download and include jQuery in your scripts: <script type="text/javascript" src="./js/jquery-1.11.3.min.js"></script>

Create an empty container for your preview : <div id='previewContainer'></div>

You can display it on clicking on a button for ex : <button class="fileClic" data-file="THE_URL_OF_YOUR_DOC">Display</button> Then a little script to embed the google document iframe :

$('.fileClic').on('click', function (e) {
    e.preventDefault();

var file = $(this).data('file'); // the url of the file you want to preview

$('#previewContainer').html('<iframe src="http://docs.google.com/viewer?url='+file+'&#038;embedded=true" width="400" height="400" style="border: none;"></iframe>') 
});