0 
<html>
<head>
var ar = new Array();

ar[0] = "box1";
ar[1] = "box1";
ar[2] = "box1";
ar[3] = "box1";
ar[4] = "box1";

var idx = -1;
var tm;

$(document).ready(function() {

tm = setInterval("moveImage()", 5000);

$(".sliderlinks li").click(function() {
    idx = parseInt($(this).attr("class"));
    changeDiv();

    clearInterval(tm);

    tm = setInterval("moveImage()", 5000);
})

$(".sliderlinks li").first().addClass("selectedpanel");

});

function moveDiv() {
++idx;

if (idx == ar.length)
    idx = 0;

changeDiv();
}

function changeDiv() {
var imgname = ar[idx];
// $(".sliderpanel").css('background-image', "url(images/" + imgname + ")");

var image = $('#sliderimage');

$(".box1").css('display','block');

image.fadeOut(500, function() {
    //image.attr("src", "images/" + imgname);
    image.fadeIn(500);
});

$(".sliderlinks li").removeClass("selectedpanel");
$("li." + idx).addClass("selectedpanel");
}
</head>
<body>
     <div class="sliderpanel">
<div id="sliderimage"/>
    <div class="box1" rel="1">box1</div>
    <div class="box2" rel="2">box2</div>
    <div class="box3" rel="3">box3</div>
    <div class="box4" rel="4">box4</div>
    <div class="box5" rel="5">box5</div>
</div>
<ul class="sliderlinks">
    <li class="0">
        <h3>Gynecological Care</h3>
        <p>Annual Exams, Birth Control-Essure, Mirena</p>
    </li>
    <li class="1">
        <h3>Obstetrical Care</h3>
        <p>Pre-Natal, VBAC, High Risk</p>       
    </li>
    <li class="2">
        <h3>Well Woman Exams</h3>
        <p>In Office Gyn Procedures</p>
    </li>
    <li class="3">
        <h3>Infertility</h3>
        <p>Diagnosis &amp; Treatment</p>
    </li>
    <li class="4">
        <h3>Urogynecology</h3>
        <p>Incontinence and Prolapse Treatment</p>
        </li>
</ul>
</div>
</body>
</html>

我想制作 jquery 框滑块，它之前是一个图像滑块，我编辑它来代替我希望我的自定义 div 在这里播放的图像。

所以这是我的代码，我试图制作一个 jquery 自动 div 滑块并点击 ui li 标签，但我被困在 jquery 中，我不知道如何播放我定义的盒子，即 box1 box2 box3 box4 和 box5。

4

0 回答 0