0

我正在尝试重现作者在此页面中展示的垂直 jcarousel 示例：

http://sorgalla.com/projects/jcarousel/examples/static_vertical.html

这是我的html代码：

  <html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <link href="skin.css" rel="stylesheet" type="text/css" />
    <script src="jquery.jcarousel.min.js" type="text/javascript"></script>
 <script type="text/javascript">
     $(document).ready(function() {
         $('#mycarousel').jcarousel({
             vertical: true,
             scroll: 2
         });
     });

</script>

</head>

<body >
    <form id="form1" runat="server">
    <div class="FinKaynDiv">

     <div id="slider">

   <ul id="mycarousel" class="jcarousel jcarousel-skin-tango"> 
                <li>Image1</li> 
                <li>Image2</li> 
                <li>Image3</li> 
                <li>Image4</li> 
                <li>Image5</li> 
                <li>Image6</li> 

            </ul> 
    </div>



    </div>
</form>

</body>
</html>

结果什么都没有，图像列表！！（注意：我已经更改了图像 src="" 以便我可以问我的问题）有问题吗？请帮忙。

4

3 回答 3

1

3 年后你现在可能已经得到答案了 :)
你的问题是你应该把div#slider. 根据 jCarousel 文档：

jCarousel 期望您的 HTML 文档中有一个非常基本的 HTML 标记结构：

<div class="jcarousel"> <--------------------------------| Root element
    <ul> <-------------------------------| List element  |
        <li>...</li> <---| Item element  |               |
        <li>...</li> <---| Item element  |               |
    </ul> <------------------------------|               |
</div> <-------------------------------------------------|

这个结构只是一个例子，不是必需的。您还可以使用如下结构：

<div class="mycarousel"> <-------------------------------| Root element
    <div> <------------------------------| List element  |
        <p>...</p> <-----| Item element  |               |
        <p>...</p> <-----| Item element  |               |
    </div> <-----------------------------|               |
</div> <-------------------------------------------------|

唯一的要求是，它由根元素、列表元素和项目元素组成。

所以你的脚本应该是这样的：

<script type="text/javascript">
     $(document).ready(function() {
         $('#slider').jcarousel({
             vertical: true,
             scroll: 2
         });
     });
</script>
于 2013-12-30T07:30:29.850 回答
0

您是否将css设置为：

<ul id="mycarousel" class="jcarousel jcarousel-skin-tango">

并参考了脚本文件：

<script type="text/javascript" src="/lib/jquery.jcarousel.min.js"></script>
<!--
  jCarousel skin stylesheet
-->
<link rel="stylesheet" type="text/css" href="/skins/tango/skin.css" />
于 2010-11-09T10:00:07.817 回答
0

你不需要加载 JQuery 吗？

<script type="text/javascript" src="../lib/jquery-1.4.2.min.js"></script>
于 2010-11-09T10:51:30.563 回答