首页 > 网站 > WEB开发 > 正文

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

2024-04-27 14:02:00
字体:
来源:转载
供稿:网友

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>


发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表