javascript - 下载图像图标并共享图标

标签 javascript html css gallery lightbox2

如何实现下载功能并从lokeshdhakar共享图标到lightbox2库?

我想要一个像退出图标这样的图标但可以下载吗?我怎样才能做到这一点?

最佳答案

使用图标库,例如fontAwesome
然后一点点jquery来找到文件位置,并将其附加在图像后作为锚点。

需要一些造型



$(document).ready(function() {
  var href = $("#downloadImage1").attr("href");

  $("#downloadImage1").append("<a href='" + href + "' download><i class='fas fa-file-download'></i></a>");
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.3/css/all.css" integrity="sha384-UHRtZLI+pbxtHCWp1t77Bi1L4ZtiqrqD80Kn4Z8NTSRyMA2Fd33n5dQ8lWUE00s/" crossorigin="anonymous">


<a href="images/image-1.jpg" data-lightbox="image-1" data-title="My caption" id="downloadImage1">Image #1</a>

关于javascript - 下载图像图标并共享图标,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54202231/

相关文章:

javascript - 设置变量时,Angular ngModel 不更新

javascript - 从另一个 html 读取集合

javascript - 将utf8字符串(图像)解码到node.js中的buffer/Image

html - 如何正确编写右侧带有文本的头像图像的 HTML 和 CSS?

html - 在 CSS 中对齐下拉菜单

javascript - 选择类(class)的第一个 child 在 <select> 中不起作用

javascript - 有没有办法更改悬停时显示的文本?

Javascript - 阻止模态键盘事件冒泡/传播

html - 使用CSS的不同颜色的线条

html - Bootstrap 4 'text-truncate' 类定位下面的文字