Question

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

 <!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>

Answer 1

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

Answer 2

您需要添加就绪功能。

$(document).ready(function() {
    $("#sb-slider").slicebox();
});

Answer 3

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

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

我有它工作但不适用于所有浏览器/平台。

如何使用slicebox

3 个答案: