0

我正在尝试让 slicebox 在测试页面中工作。从文档来看，我似乎需要使用 slicebox css 文件并将 jquery 脚本与 slicebox.js 链接起来。从那里开始，我认为它就像在脚本中调用函数一样简单，就像在 "$('#sb-slider').slicebox(); 但图片甚至没有出现。

 <!DOCTYPE html>
 <html lang="en">
 <head>
    <title>Slicebox Test</title>
    <link rel="stylesheet" type="text/css" href="css/slicebox.css" />
</head>
<body>
    <ul id="sb-slider" class="sb-slider">
        <li>
            <a href="http://www.flickr.com/photos/strupler/2969141180" target="_blank"><img src="images/1.jpg" alt="image1"/></a>
        </li>
        <li>
            <a href="http://www.flickr.com/photos/strupler/2968268187" target="_blank"><img src="images/2.jpg" alt="image2"/></a>
        </li>
        <li>
            <a href="http://www.flickr.com/photos/strupler/2968114825" target="_blank"><img src="images/3.jpg" alt="image1"/></a>
        </li>
        <li>
            <a href="http://www.flickr.com/photos/strupler/2968122059" target="_blank"><img src="images/4.jpg" alt="image1"/></a>
        </li>
        <li>
            <a href="http://www.flickr.com/photos/strupler/2969119944" target="_blank"><img src="images/5.jpg" alt="image1"/></a>
        </li>
        <li>
            <a href="http://www.flickr.com/photos/strupler/2968126177" target="_blank"><img src="images/6.jpg" alt="image1"/></a>
        </li>
        <li>
            <a href="http://www.flickr.com/photos/strupler/2968945158" target="_blank"><img src="images/7.jpg" alt="image1"/></a>
        </li>
    </ul>

    <div>
        <a href="#">Next</a>
        <a href="#">Previous</a>
    </div>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
    <script type="text/javascript" src="js/jquery.slicebox.js"></script>
    <script type="text/javascript">
     $("#sb-slider").slicebox();
    </script>
  </body>
  </html>
4

3 回答 3

1

你有这个文件夹中的css和js吗？css/slicebox.css js/jquery.slicebox.js 也许这就是问题所在。您必须下载并将其放在该文件夹中

于 2013-12-19T14:52:24.410 回答
0

您确实需要添加一个就绪功能。

$(document).ready(function() {
    $("#sb-slider").slicebox();
});
于 2013-01-04T04:16:03.290 回答
0

我认为您还需要在其中链接包含的现代化脚本。

<script type="text/javascript" src="/scripts/modernizr.custom.46884.js"></script>

我让它工作但不是在所有浏览器/平台上。

于 2013-01-21T10:22:16.243 回答