手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >js实现div的切换特效上一个下一个
js实现div的切换特效上一个下一个
摘要:JS部分:复制代码代码如下://下一个divfunctionnext(){vararr=document.getElementById('t...

JS部分:

复制代码 代码如下:

//下一个div

function next() {

var arr = document.getElementById('tdBjzbsx').getElementsByTagName('div');

for (i = 0; i < arr.length-1; i++) {

if ((arr[i].style.display == "block"||arr[i].style.display == "") && i <= 2) {

arr[i + 1].style.display = "block";

arr[i].style.display = "none";

}

}

}

//上一个div

function top() {

var arr = document.getElementById('tdBjzbsx').getElementsByTagName('div');

for (i = 0; i < arr.length; i++) {

if ((arr[i].style.display == "block"||arr[i].style.display == "") && i <= 3) {

arr[i - 1].style.display = "block";

arr[i].style.display = "none";

break;

}

}

}

JSP部分:

复制代码 代码如下:

<table>

<tr>

<td id="tdBjzbsx">

<div id="div1">

1

</div>

<div id="div2">

2

</div>

<div id="div3">

3

</div>

</td>

<td>

<input type="button" value="上一步" id="syb" name="cz2" disabled="true"/></br></br>

<input type="button" value="下一步" id="xyb" name="cz3"/></br></br>

</td>

</tr>

</table>

【js实现div的切换特效上一个下一个】相关文章:

js操作css属性实现div层展开关闭效果的方法

jQuery插件zepto.js简单实现tab切换

jQuery实现不断闪烁文字的方法

javascript实现行拖动的方法

原生javascript实现解析XML文档与字符串

Nodejs实现批量下载妹纸图

javasript实现密码的隐藏与显示

利用js实现禁止复制文本信息

JavaScript实现的MD5算法完整实例

js实现顶部可折叠的菜单工具栏效果实例

精品推荐
分类导航