javascript - 使用bumpbox、mootools.js实现pdf lightbox并确保用户滚动到文档末尾

Question

我有一个数据访问策略(url 中的 pdf 格式)，我想将其显示为弹出灯箱给用户。用户应该向下滚动然后同意。

我使用bumpbox-2.0.1-min.js和mootools.js文件来实现PDF灯箱，但它对我不起作用。代码如下:

HTML

<div class="pure-controls submit_form">
    <input id="cb" type="checkbox" required> I've read the
      <a href="http://wiki.abc.com/abc/Data_protection.pdf" class="bump">Data Access Policy</a>
       </label><br>
    <button type="submit" name="edit_value" class="pure-button">Submit Request</button> 
</div>

JS

<script type="text/javascript" src="../includes/mootools.js"></script>
<script type="text/javascript" src="../includes/bumpbox-2.0.1-min.js"></script>

<script type="text/javascript">doBump('.bump');</script>

任何人都可以让我知道我在这里做错了什么吗？另外，如何确保用户向下滚动到页面末尾，然后在灯箱中点击“提交”。

提前致谢。

Answer 1

您需要在这里使用 Mootools compat(jsfiddle 版本 1.3.2 或 1.4.5 适用于我)。否则，您会在凹凸框 .js 文件中收到 Browser.version.name 错误。 可以找到here .

这实际上适用于 Mootools 1.2.6，但不适用于不兼容的 1.3。

Demo