非常新的JQuery初学者-放大弹出窗口

Very new JQuery Beginner- magnific-popup

本文关键字:放大 窗口 初学者 JQuery 非常      更新时间:2023-09-26

我对Javascript非常陌生,虽然有些是直观的,但我有点迷失了方向。尝试创建一个Jquery Magnific弹出网站来展示vimeo视频,因为它是一个免费插件。我想要缩略图链接到这个弹出脚本。

我发现自己对包含哪些文件和不使用哪些文件感到非常困惑,因为我是Javascript的新手。

我一直在使用这个网站:http://dimsemenov.com/plugins/magnific-popup/documentation.html#mfp-构建工具

我应该使用哪些脚本,我应该省略哪些脚本?请帮忙!我很感激任何帮助感谢

您不确定包含哪些内容?Magnific文档在你粘贴的链接上做得很好。

基本上,你会得到他们说的3个文件,并按照你在他们页面上看到的顺序将它们包括在内。CSS,然后是jquery,然后是amplific。这些文件的路径会因保存位置而异。

Vimeo的东西,我不知道。

您可以查看Jquery的内容,它可能会帮助您解决所有Javascript需求。首先,JQuery只是它的Javascript包,它有许多有用的预定义函数、属性等等。。。首先查看JQuery页面http://jquery.com/如果你想查看弹出式表单,只需查看链接http://jqueryui.com/dialog/#modal-表单

这里有一个非常简单的弹出图像示例:

<!DOCTYPE HTML>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <!-- Magnific Popup core CSS file -->
        <link rel="stylesheet" href="css/magnific-popup.css"> 
        <!-- jQuery 1.7.2+ or Zepto.js 1.0+ -->
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
        <!-- Magnific Popup core JS file -->
        <script src="js/jquery.magnific-popup.min.js"></script> 
    </head>
    <body>
        <a class="test-popup-link" href="img/img.jpg">Open popup</a>
    </body>
    <footer>
        <script>
            $('.test-popup-link').magnificPopup({ 
              type: 'image'
                // other options
            });
        </script>
    </footer>
</html>