JSFiddle - React, Tailwind, and code Playground

by Craig Martin

HTML

<script src="https://cdn.jsdelivr.net/npm/[email protected]/examples/scripts/watermark.js"></script>
      <div class="example" id="lower-right">
        <h2>Lower Right</h2>
        <pre>
          <code class="javascript">
watermark(['https://cdn.shopify.com/s/files/1/0647/4927/3302/files/beforeafter3a.jpg', 'https://cdn.shopify.com/s/files/1/0647/4927/3302/files/shigeru_lash_and_brow_logo.png'])
      .image(watermark.image.lowerRight(0.5))
      .then(function (img) {
        var pre = document.querySelector('#lower-right pre');
        pre.parentNode.insertBefore(img, pre);
      });
          </code>
        </pre>
      </div>

JavaScript

// lower right positioning
    watermark(['https://cdn.shopify.com/s/files/1/0647/4927/3302/files/beforeafter3a.jpg', 'https://cdn.shopify.com/s/files/1/0647/4927/3302/files/shigeru_lash_and_brow_logo.png'])
      .image(watermark.image.lowerRight(0.5))
      .then(function (img) {
        var pre = document.querySelector('#lower-right pre');
        pre.parentNode.insertBefore(img, pre);
      });