jquery实现前一个和后一个效果
2010-09-14 13:08:54 来源：WEB开发网[示例代码]
<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 .ajax方法 异步表单，接收服务器返回的数据...
- ››jquery 添加\删除 cookie
- ››jquery 正则表达式判断是否为正确邮箱格式
- ››jQuery EasyUI 数字框(NumberBox)用法
- ››JQuery中对option的添加、删除、取值
- ››实现dedeCMS二级导航的简单方法
- ››实现discuz投票选项文字添加链接进入查看详情
- ››JQuery实现下拉,单选,复选三大控件方法,
- ››实现android socket 聊天与调试
- ››jquery实现判断输入文字个数的代码
- ››实现windows7系统3D切换页面的方法
- ››实现Windows7系统局域网发现共享
中查找“jquery实现前一个和后一个效果”更多相关内容
中查找“jquery实现前一个和后一个效果”更多相关内容更多精彩
赞助商链接
