index.html

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JXL.js Demo</title>
  <link rel="prefetch" href="jxl_dec.js" fetchpriority="high">
  <link rel="prefetch" href="jxl_dec.wasm" fetchpriority="high">
  <script src="jxl.min.js"></script>
</head>
<body>
    <h1><a href="https://github.com/niutech/jxl.js" style="color: inherit;">JXL.js</a> demo</h1>
    <p>Image:</p>
    <img src="img/test.jxl" width="1024" height="1280" alt="Here is the image">
    <p>Background image:</p>
    <div style="background: url(img/test2.jxl) center / contain; width: 1000px; height: 1000px;"></div>
    <p>Picture:</p>
    <picture>
      <source srcset="img/test3.jxl" type="image/jxl">
      <img src="img/test3.jpg" width="1024" height="1024" alt="Here is the picture">
    </picture>
</body>
</html>