Question

任何人都可以帮助我如何使用ajax实现垂直jCarousel。

Answer 1

在jCarousel docs的第一页上可以很容易地找到这个问题的答案，但是好的，我会在这里为你复制;）

首先下载jCarousel并将所有来源添加到您的<head>代码中。

<script type="text/javascript" src="/path/to/jquery-1.2.1.pack.js"></script>
<script type="text/javascript" src="/path/to/lib/jquery.jcarousel.pack.js"></script>
<link rel="stylesheet" type="text/css" href="/path/to/lib/jquery.jcarousel.css" />
<link rel="stylesheet" type="text/css" href="/path/to/skin/skin.css" />

然后在您希望旋转木马放置此代码的地方。

<ul id="mycarousel" class="jcarousel-skin-name">
   <!-- The content goes in here -->
</ul>

然后添加js代码以初始化您的轮播。

<script type="text/javascript">
jQuery(document).ready(function() {
    jQuery('#mycarousel').jcarousel({
        // Carousel gonna be vertical
        vertical : true,
        // AJAX callback
        itemLoadCallback: itemLoadCallbackFunction
    });
});
</script>

然后，您需要创建itemLoadCallBackFunction以实际将新项目动态加载到轮播中。基本上，一旦你得到一个索引为i的项目，你只需将其插入带有carousel.add(i, item)的轮播。

UPD：

Here是一个PHP脚本的例子，你可以从那里获得一些灵感。

使用Ajax和PHP的垂直轮播

1 个答案: