小编Roa*_*rnr的帖子

多个CSS模态框

所以我正在阅读以下文章:使用CSS3创建模态窗口

但是,我想通过向我的网站添加多个模态框来修改它.

这是原始模态的代码:

<a href="#openModal">Open Modal</a>

<div id="openModal" class="modalDialog">
    <div>
        <a href="#close" title="Close" class="close">X</a>
    <h2>Modal Box</h2>
    <p>This is a sample modal box that can be created using the powers of CSS3.</p>
    <p>etc..etc..</p>
</div>
Run Code Online (Sandbox Code Playgroud)

<div id=openModal" 对于创建多个模态没有CSS调用,我的假设是将div更改为<div id=openModal2" class="modalDialog2">

样式只在modalDialog框上,所以对于第二个模态,我会假设我也会改变它的类名.

但是,每次执行此操作时,都不会打开模态框.

这是我的代码:

<a href="#openModal1">Box 1</a>

<div id="openModal1" class="modalDialog1">
<div>
    <a href="#close" title="Close" class="close">X</a>
    <h2>Modal Box 1</h2>
    <p>This is a sample modal box that can be created using the powers of CSS3.    </p>
    <p>You could do a lot of things …
Run Code Online (Sandbox Code Playgroud)

html5 modal-dialog css3

6
推荐指数
1
解决办法
3万
查看次数

标签 统计

css3 ×1

html5 ×1

modal-dialog ×1