Question

我正在尝试在此页面中重现作者的垂直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 =“”以便我可以问我的问题）有问题吗？请帮助。

Answer 1

3年后你可能已经得到了答案:) 你的问题是你应该j 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>

Answer 2

你有没有像以下那样设置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" />

Answer 3

你不需要加载JQuery吗？

<script type="text/javascript" src="../lib/jquery-1.4.2.min.js"></script>

简单的垂直jcarousel不工作

3 个答案: