我刚开始使用 RequireJS 和 Magnific Popup，我想知道是否有人成功地让它们一起工作。如果是这样，您的代码的基本结构是什么？
谢谢!
最佳答案
首先在 html 文件中设置一个启动点:
<!DOCTYPE html>
<html>
<body>
<script data-main="entrypoint" src="//cdnjs.cloudflare.com/ajax/libs/require.js/2.1.15/require.min.js"></script>
</body>
</html>
然后在entrypoint.js中你可以配置jquery和放大弹出窗口:
require.config({
paths : {
jquery : '//ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min',
magnificpopup : 'path/to/magnific-popup.min',
},
shim: {
'magnificpopup': ['jquery']
}
});
require([ 'popuptest' ], function(popuptest) {
popuptest.show();
});
最后，在 popuptest.js 上我们可以打开一个 YouTube 弹出窗口，如下所示:
define(['jquery', 'magnificpopup'], function($, magnificpopup) {
return {
show: function() {
$.magnificPopup.open({
items: {
src: 'https://www.youtube.com/watch?v=btPJPFnesV4'
},
type: 'iframe',
iframe: {
cursor: null,
titleSrc: function(item) {
return 'Video title';
},
patterns: {
youtube_short: {
index: 'youtu.be/',
id: 'youtu.be/',
src: '//www.youtube.com/embed/%id%?autoplay=1'
}
}
}
});
}
});
});
希望这有帮助。
关于javascript - 让 Magnific Popup 与 RequireJS 一起使用，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/26614704/