放大镜弹出窗口不起作用.所有文件路径都是正确的



当用户使用放大镜弹出窗口单击链接时,我正在尝试打开弹出窗口,但它不起作用。文件的顺序正确,但行不通。我的控制台说:

uck typeerror:窗口。$(...(。巨大popup不是函数

这是我的代码

<html>
<head>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/magnific-popup.js/1.1.0/magnific-popup.min.css">
</head>
<body>
<a class="hello" href="imgs/work/1.jpg">clcik here to popup</a>
<script
  src="https://code.jquery.com/jquery-3.4.1.js"
  integrity="sha256-WpOohJOqMqqyKL9FccASB9O0KwACQJpFTUBLTYOVvVU="
  crossorigin="anonymous"></script>
<script type="javascript" src="https://cdnjs.cloudflare.com/ajax/libs/magnific-popup.js/1.1.0/jquery.magnific-popup.min.js"></script>
<script>
$('.hello').magnificPopup({
    type: "image" // <== comma shouldn't be here since there is nothing to initialize after this
});
</script>
</body>
</html> 

并非所有人都正确 - 您使用的是而不是/

所以 -

<a class="hello" href="imgswork1.jpg">clcik here to popup</a>

应该是 -

<a class="hello" href="imgs/work/1.jpg">clcik here to popup</a>

和这个 -

<script src="jsjquery.js"></script>

应该是 -

<script src="js/jquery.js"></script>

编辑:阅读文档后(快速Google搜索(,看来您错过了初始化弹出窗口

的步骤

您需要添加此信息: -

$(document).ready(function() {
  $('.image-link').magnificPopup({type:'image'});
});

最新更新