css - 尝试改造按钮以打开模态窗口

Question

我一直在使用 HTML5 UP Photon 模板 https://html5up.net/photon我正在尝试改进底部的一个名为“了解更多”的按钮，以打开一个包含几段文本的模式窗口。我试图给按钮一个 btnID 并链接一个 js 函数来打开它，但我无法让它工作。任何帮助，将不胜感激。这是 html。我认为预设类引用了 Bootstrap。

<li><a href="" class="button">Learn More</a></li>

Answer 1

据我所知，您使用的模板没有提供任何开箱即用的模态窗口组件，因此您必须找到一个并插入其中或自己编写一个。假设您想要现成的东西，您需要执行以下操作:

1. 搜索 jquery 模态窗口并找到您喜欢的。
2. 将其 js 和 css 文件下载到您的页面(或使用 CDN)
3. 编写一些简单的 jquery 来调用该模式。它可以像编写 $('a:contains("Learn More")').modal() 一样简单。这取决于您选择的模态组件

如果您需要更多帮助，请在评论中告诉我