使用Orbit滑块的随机图像顺序

时间:2013-06-24 20:53:40

标签: jquery orbit

我正在使用Orbit滑块,并希望从我的图像集中随机选择第一张图像,而不是代码中指定的顺序。

以下是滑块和我的代码的链接。 http://zurb.com/playground/orbit-jquery-image-slider

的jQuery

$(window).load(function () {
    $('#featured').orbit();
});

HTML

<div id="featured">
    <a href="1.php" data-caption="#htmlCaption1" target="_parent">
        <img    src="/images/image1.jpg"   border="0" />
    </a>
    <a href="2.php" data-caption="#htmlCaption2" target="_parent">
        <img src="/images/image1.jpg"  border="0" />
    </a>
    <a href="3.php" data-caption="#htmlCaption3" target="_parent">
        <img src="/images/image1.jpg" border="0"/>
    </a>
</div>
<span class="orbit-caption" id="htmlCaption1"> Text here.</span>
<span class="orbit-caption" id="htmlCaption2"> Text here.</span>
<span class="orbit-caption" id="htmlCaption3"> Text here.</span>

1 个答案:

答案 0 :(得分:0)

如果轨道没有随机启动选项,则在调用orbit()之前尝试预处理图像列表。

这样的事情应该这样做:

var $container = $("#featured");
var n = $container.find("a").length;
var rand = Math.floor((Math.random() * n) + 1);
for(var i=0; i<rand; i++) {
    $container.find("a").eq(0);
}
$container.orbit();