[示例代码]
<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>
—-想了解更多的jquery相关特效编写怎么解决关注<计算机技术网(www.ctvol.com)!!>
本文来自网络收集，不代表计算机技术网立场，如涉及侵权请联系管理员删除。
ctvol管理联系方式QQ:251552304
本文章地址：https://www.ctvol.com/jquerytutorial/91266.html