<!DOCTYPE html> <html> <head> <title>Mirador POC</title> <script type="text/javascript" src='../../../build/openseadragon/openseadragon.js'></script> <script type="text/javascript" src='../../lib/jquery-1.9.1.min.js'></script> <script src="//d3js.org/d3.v3.min.js" charset="utf-8"></script> <script src="js/main.js"></script> <script src="js/page.js"></script> <!-- <script src="js/harvard-tilesources.js"></script> --> <script src="js/openseadragon-svg-overlay.js"></script> <style type="text/css"> html, body { width: 100%; height: 100%; margin: 0; } body { background: #eee; overflow: scroll; } .header { height: 30px; } .nav { display: inline-block; margin-left: 50px; } .active { background: #ddf; } .hidden { visibility: hidden; } .openseadragon1 { background: white; } .viewer-position { position: absolute; left: 0; top: 30px; right: 0; bottom: 0; } .scroll-cover { display: none; overflow: scroll; z-index: 100; } </style> </head> <body> <div class="header"> <button class="thumbs">Thumbnails</button> <button class="scroll">Scroll</button> <button class="book">Book</button> <button class="page">Page</button> <label><input class="details" type="checkbox">Show Detail Overlays</label> <div class="nav"> <button class="previous">Previous</button> <button class="next">Next</button> </div> </div> <div id="contentDiv" class="openseadragon1 viewer-position"></div> <div class="scroll-cover viewer-position"> <div class="scroll-inner"></div> </div> </body> </html>