当前位置导航:炫浪网>>网络学院>>网页制作>>JavaScript教程

javascript实现四个重叠DIV切换功能

HTML如下

<html>

<script src="/static/js/jquery-1.2.6.js" type="text/javascript"></script>

<style type="text/css">

    .jdjj
{
 
 }

</style>
    <div><table><tr><td><a href="#"></a></td><td><a href="#" onclick="jdjjchange(0)">DIV1</a></td><td><a href="#"onclick="jdjjchange(1)">DIV2</a></td><td><a href="#"onclick="jdjjchange(2)">DIV3</a></td><td><a href="#"onclick="jdjjchange(3)">DIV4</a></td></tr></table></div>
 <div id="jdjj">
 <div class="jdjj" >1</div>
 <div class="jdjj"  style="display:none;">2</div>
 <div class="jdjj"  style="display:none;">3</div>
 <div class="jdjj"  style="display:none;">4</div>
 </div>

</html>

<script type="text/javascript">

function jdjjchange(i) {
    $(".jdjj").hide().eq(i).show();
}

</script>


</html>

相关内容
赞助商链接