将下载链接添加到放大的弹出图像库

Question

我想在用户单击缩略图后在标题旁边添加下载链接或图像源吗？

到目前为止，我已经设法使弹出窗口正常工作，但是我似乎无法创建像图像一样的下载文件。

下面的代码是我到目前为止。

<div class="product-thumb">
  <a href="images/product-image7.jpg" class="image-popup" title="screenprinting">
    <img src="images/product-image7.jpg" class="img-responsive" alt="">
    <div class="product-info">
      <div class="product-item">
        <h3>PRODUCT1</h3>
        <p>Size / Size / Size</p>
      </div>
      <div class="product-price">
        <span>P50</span>
      </div> 
    </div>
  </a>
</div>

Answer 1

<a download="picture.jpg" href="/path/to/your/picture" title="pictureName">
    <img alt="" src="/path/to/your/picture">
</a>

并非所有浏览器都支持