Question

我正在使用jquery popup overlay插件（我之所以选择它是因为它具有响应性）。我在我的页面上有许多链接，当我点击它们时它会显示一个包含不同内容的弹出窗口。

这是我的代码：

<div class="more">
    <a class="my_modal_open_1" href="#"></a>
</div>
<div id="my_modal_1">
    <div class="image-odd">
        <img src="images/post/1_guerlain.png" width="421" height="590" />
    </div>
    <a href="#" class="my_modal-close">Close</button>
</div>
<script type="text/javascript">
    $(".my_modal_open_1").click(function() {
        $("#my_modal_1").popup();
    });
</script>

但是当我这样做时，它并没有向我展示任何东西......

你对此有什么想法吗？

谢谢：）

Answer 1

在任何jQuery被重新命名之前，您需要输入$(document).ready(function)({ //all jQuery codes goes here }); 在你的情况下应该是：

    <script>
      $(document).ready(function)({
        //then goes what you wanted to do
        $(".my_modal_open_1").click(function() {
           $("#my_modal_1").popup();
        });
      });
    </script>

Answer 2

我首先尝试来自Sashka的建议。如果这不起作用，请尝试在onclick函数中放置一个警报，看它是否被执行。

您也可以尝试：

<script>
    $(function() {
      $("#my_modal_1").popup();
    });
</script>

查看弹出功能是否有效。

Answer 3

根据我对此插件的理解，.popup()方法不会显示内容，而是在页面加载时将其作为弹出窗口启用。

Here's向你展示我的意思。

弹出窗口没有显示

3 个答案: