項目中需要做一個相冊功能。選擇的是fancybox,大概記錄一下使用方法:
1.引用fancybox所需要的文件,你可以下載至本地或者引用CDN。
fancybox最新版本下載地址:http://fancyapps.com/fancybox/3/
CDN引用地址:
<link href="https://cdn.bootcss.com/fancybox/3.3.5/jquery.fancybox.css" rel="stylesheet"> <script src="https://cdn.bootcss.com/fancybox/3.3.5/jquery.fancybox.min.js"></script>
2.編寫相冊所需的HMTL代碼:
我這里是需要創建相冊,所以同一個相冊的data-fancybox的名字需保持一致。
注意:老版本是用rel,現在已經不支持了。我開始用的是新版本的,看的是老版本的文檔,用rel沒效果。這種低級錯誤,大家就不要再犯了。
官方文檔截圖:
更詳細的參數可訪問:http://fancyapps.com/fancybox/3/docs/#usage
3.通過JS引用fancybox:
$(".js_gallery_evaluate").fancybox();
切記,看文檔一定要跟你使用的版本對上號!!!