mirador.html

<?xml version="1.0" encoding="UTF-8"?>
<html lang="en">
    <head>
        <title>Simple Viewer</title>
        <meta charset="UTF-8"/>
        <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
        <style>
            #viewer {
                width: 100%;
                height: 100%;
                position: fixed;
            }</style>
        <link rel="stylesheet" type="text/css" href="../resources/scripts/mirador/css/mirador-combined.css"/>
        
        <script src="../resources/scripts/mirador/mirador.js"/>
        
    </head>
    <body>
        <div id="viewer"/>
        <script type="text/javascript">
      $(function() {
        Mirador({
          id: "viewer",
          layout: "1x3",
          data: [
            {"manifestUri": "https://www.manuscripta.se/iiif/100500/manifest.json"},
            {"manifestUri": "https://www.manuscripta.se/iiif/100502/manifest.json"},
            {"manifestUri": "https://www.manuscripta.se/iiif/100503/manifest.json"}
          ],
            windowObjects: [
            {
             "loadedManifest" : "https://www.manuscripta.se/iiif/100500/manifest.json",
             "canvasID" : "https://www.manuscripta.se/iiif/100500/canvas/c-577.json",
             "slotAddress" : "row1.column1",
             "viewType" : "ImageView"
            },
            {
             "loadedManifest" : "https://www.manuscripta.se/iiif/100503/manifest.json",
             "slotAddress" : "row1.column2",
             "viewType" : "ImageView"
            },
            {
             "loadedManifest" : "https://www.manuscripta.se/iiif/100502/manifest.json",
             "canvasID" : "https://www.manuscripta.se/iiif/100502/canvas/c-415.json",
             "slotAddress" : "row1.column3",
             "viewType" : "ImageView"
            },
         ]          
        });
      });
    </script>
    </body>
</html>