Question

<div class="salt">
        <a href="#" data-reveal-id="myModal" data-animation="fadeAndPop">
            <img src="img/CLR.jpg" width="116px" height="48px">
        </a>
    </div>

    <div id="myModal" class="reveal-modal">
        <h1>Title</h1>
        <p>content could go in here.</p>
        <a class="close-reveal-modal">&#215;</a>
    </div>
</div>

单击该图像将不显示任何内容。

reveal.js链接是 https://dl.dropboxusercontent.com/u/48992367/AppzVenture/extra/jquery.reveal.js

jsfiddle链接 http://jsfiddle.net/8Leu4/2/

Answer 1

这是您的代码中缺少的内容：揭示CSS文件的链接;

<link rel="stylesheet" type="text/css" href="reveal.css">

包括jquery 1.4.4或更高版本并包括jquery揭示可以从here下载所需的文件所以你的代码应该是这样的：

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <link rel="stylesheet" type="text/css" href="reveal.css">
    <script type="text/javascript" src="jquery.min.js"></script>
    <script type="text/javascript" src="jquery.reveal.js"></script>
</head>
<body>
    <div class="salt">
        <a href="#" data-reveal-id="myModal" data-animation="fadeAndPop">
            <img src="img/CLR.jpg" width="116px" height="48px"/>
        </a>
    </div>

    <div id="myModal" class="reveal-modal">
        <h1>Modal Title</h1>
        <p>Any content could go in here.</p>
        <a class="close-reveal-modal">&#215;</a>
</div>
</body>
</html>

显示Modal Popup不起作用

1 个答案: