时间戳

首页 > 解决方案 > jquery模态褪色问题

javascript - jquery模态褪色问题

问题描述

我找到了一些用于在线制作模态的代码，但是当我尝试实现淡入淡出部分时，它只能工作一次并自动打开，除非我删除我的脚本部分。可能是什么问题呢？这是我的代码：

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


<h2>My Modal</h2>

<div id="fade" class="modal">
    <p>Thanks for clicking.</p>
    <a href="#" rel="modal:close">Close</a>
</div>

<p><a href="#fade" rel="modal:open">Open Modal</a></p>

<script>
    $("#fade").modal({
        fadeDuration: 200,
    });

</script>

标签： javascriptjquery

解决方案

适用于我的 Chrome。顺便说一句，小部件文档可以在https://jquerymodal.com/找到

对话框自动打开的原因是该.modal()功能打开了对话框。但是请注意，具有属性的锚元素的定义 rel="modal:open"附加了一个处理程序，如果对话框处于关闭状态，则该处理程序会在单击时打开对话框。.modal()因此，在您的代码中不需要调用，它会导致在加载页面时打开对话框。

但是，要设置淡入淡出效果，您可以$.modal.defaults根据需要设置属性。我已经使用jsFiddle根据您的代码编译了一个工作示例。

推荐阅读