Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
- <script type="text/javascript" src="../../turn.min.js"></script>
- <style type="text/css">
- body{
- background:#ccc;
- }
- #magazine{
- width:1152px;
- height:752px;
- }
- #magazine .turn-page{
- background-color:#ccc;
- background-size:100% 100%;
- }
- </style>
- </head>
- <body>
- <div id="magazine">
- <div style="background-image:url(pages/01.jpg);"></div>
- <div style="background-image:url(pages/02.jpg);"></div>
- <div style="background-image:url(pages/03.jpg);"></div>
- <div style="background-image:url(pages/04.jpg);"></div>
- <div style="background-image:url(pages/05.jpg);"></div>
- <div style="background-image:url(pages/06.jpg);"></div>
- </div>
- <script type="text/javascript">
- $(window).ready(function() {
- $('#magazine').turn({
- display: 'double',
- acceleration: true,
- gradients: !$.isTouch,
- elevation:50,
- when: {
- turned: function(e, page) {
- /*console.log('Current view: ', $(this).turn('view'));*/
- }
- }
- });
- });
- $(window).bind('keydown', function(e){
- if (e.keyCode==37)
- $('#magazine').turn('previous');
- else if (e.keyCode==39)
- $('#magazine').turn('next');
- });
- </script>
- if (!PDFJS.PDFViewer || !PDFJS.getDocument) {
- alert('Please build the pdfjs-dist library usingn' +
- ' `gulp dist-install`');
- }
- // The workerSrc property shall be specified.
- //
- PDFJS.workerSrc = '../../node_modules/pdfjs-dist/build/pdf.worker.js';
- // Some PDFs need external cmaps.
- //
- // PDFJS.cMapUrl = '../../node_modules/pdfjs-dist/cmaps/';
- // PDFJS.cMapPacked = true;
- var DEFAULT_URL = '../../web/compressed.tracemonkey-pldi-09.pdf';
- var PAGE_TO_VIEW = 1;
- var SCALE = 1.0;
- var container = document.getElementById('pageContainer');
- // Loading document.
- PDFJS.getDocument(DEFAULT_URL).then(function (pdfDocument) {
- // Document loaded, retrieving the page.
- return pdfDocument.getPage(PAGE_TO_VIEW).then(function (pdfPage) {
- // Creating the page view with default parameters.
- var pdfPageView = new PDFJS.PDFPageView({
- container: container,
- id: PAGE_TO_VIEW,
- scale: SCALE,
- defaultViewport: pdfPage.getViewport(SCALE),
- // We can enable text/annotations layers, if needed
- textLayerFactory: new PDFJS.DefaultTextLayerFactory(),
- annotationLayerFactory: new PDFJS.DefaultAnnotationLayerFactory()
- });
- // Associates the actual page with the view, and drawing it
- pdfPageView.setPdfPage(pdfPage);
- return pdfPageView.draw();
- });
- });
- <html dir="ltr" mozdisallowselectionprint>
- <head>
- <meta charset="utf-8">
- <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
- <meta name="google" content="notranslate">
- <title>PDF.js viewer using built components</title>
- <style>
- body {
- background-color: #808080;
- margin: 0;
- padding: 0;
- }
- #viewerContainer {
- overflow: auto;
- position: absolute;
- width: 100%;
- height: 100%;
- }
- </style>
- <link rel="stylesheet" href="../../node_modules/pdfjs-dist/web/pdf_viewer.css">
- <script src="../../node_modules/pdfjs-dist/build/pdf.js"></script>
- <script src="../../node_modules/pdfjs-dist/web/pdf_viewer.js"></script>
- </head>
- <body tabindex="1">
- <div id="viewerContainer">
- <div id="viewer" class="pdfViewer"></div>
- </div>
- <script src="simpleviewer.js"></script>
- </body>
- </html>
Add Comment
Please, Sign In to add comment