[示例代码]
<html>
<head>
<script src="jquery-1.2.js"></script>
<script>
$(document).ready (
function () {
$("#previous").click (
function () {
var current;
$("#items .item").each(
function (index, element) {
if ("red" === $(element).css("color")) {
current = index;
}
}
);
$("#items .item").each(
function (index, element) {
if (index === current - 1) {
$($("#items .item")[current]).css("color", "");
$(element).css("color", "red");
}
}
);
}
);
}
);
$(document).ready (
function () {
$("#next").click (
function () {
var current;
$("#items .item").each(
function (index, element) {
if ("red" === $(element).css("color")) {
current = index;
}
}
);
$("#items .item").each(
function (index, element) {
if (index === current + 1) {
$($("#items .item")[current]).css("color", "");
$(element).css("color", "red");
}
}
);
}
);
}
);
</script>
</head>
<body>
<div id="items">
<div class="item" style="color: red;">
1
</div>
<div class="item">
2
</div>
<div class="item">
3
</div>
<div class="item">
4
</div>
<div class="item">
5
</div>
<div class="item">
6
</div>
<div class="item">
7
</div>
<div class="item">
8
</div>
<div class="item">
9
</div>
<div class="item">
10
</div>
</div>
<button id="previous">
previous
</button>
<button id="next">
next
</button>
</body>
</html>
本文作者: