Question

我正在尝试使用shadowbox.js在当前网页的顶部打开图像。但是，当我点击链接时，它会将我带到我的图像，而下面的页面会转到空白页面。有谁知道如何在保持当前页面的同时打开影子框？

这是我的代码：

<head>
    <script src="shadowbox-3.0.3/shadowbox.js" type="text/javascript"></script>
    <link rel="stylesheet" href="shadowbox-3.0.3/shadowbox.css" type="text/css">
</head>

<body onload="Shadowbox.init();">
    <table>
        <tr>
            <td><a href="ss1.jpg" rel="shadowbox[screenshots]">image #1</a></td>
            <td><a href="ss2.jpg" rel="shadowbox[screenshots]">image #1</a></td>
            <td><a href="ss3.jpg" rel="shadowbox[screenshots]">image #1</a></td>
        </tr>
    </table>

</body>

Answer 1

根据文档建议，将Shadowbox.init()添加到<head>。可能先把CSS链接放在一边;再次如文件所示。以下内容应该进入头部

<script src="shadowbox-3.0.3/shadowbox.js" type="text/javascript"></script>
<link rel="stylesheet" href="shadowbox-3.0.3/shadowbox.css" type="text/css">
<script type="text/javascript">
 Shadowbox.init();
</script>

来源：http://www.shadowbox-js.com/usage.html

下面的工作页面：

<html>
<head>
 <script src="shadowbox.js" type="text/javascript"></script>
 <link rel="stylesheet" href="shadowbox.css" type="text/css">
 <script type="text/javascript">
   Shadowbox.init();
 </script>
</head>
<body>
<table>
    <tr>
        <td><a href="ss1.jpg" rel="shadowbox[screenshots]">image #1</a></td>
        <td><a href="ss2.jpg" rel="shadowbox[screenshots]">image #2</a></td>
        <td><a href="ss3.jpg" rel="shadowbox[screenshots]">image #3</a></td>
    </tr>
</table>
</body>
</html>

shadowbox将图像打开到新页面

1 个答案: