Question

我无法让这个基本代码适用于fancybox3。是不是加载了js库？

<!doctype html>
<html><head>
<meta charset="UTF-8">
<script src="//code.jquery.com/jquery-3.1.1.min.js"></script>

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.0.47/jquery.fancybox.min.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.0.47/jquery.fancybox.min.js"></script>

</head>

<body>

<a data-fancybox="gallery" href="big_1.jpg">
<img src="small_1.jpg">
</a>


</body>
</html>

Answer 1

将脚本放在结束body标记之前。

＆＃13;

<!doctype html>
<html>

<head>
  <meta charset="UTF-8">
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.0.47/jquery.fancybox.min.css" />
</head>

<body>

  <a data-fancybox="gallery" href="https://i.ytimg.com/vi/yaqe1qesQ8c/maxresdefault.jpg">
    <img src="https://i.ytimg.com/vi/yaqe1qesQ8c/maxresdefault.jpg">
  </a>
  
  
  <script src="//code.jquery.com/jquery-3.1.1.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.0.47/jquery.fancybox.min.js"></script>
</body>

</html>

＆＃13;

Answer 2

通过添加：

，工作得很好

<link rel="stylesheet prefetch" href="jquery.fancybox.min.css">

在其他人推荐的情况下，在body close标记上方添加脚本

谢谢你们。

Fancybox3修复js库

2 个答案: