大家好,欢迎来到IT知识分享网。
1. 点击详情即可出现二级页面
2.点击删除即可还原最初页面
以下为源代码,快去试试吧
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script src="../js/jquery-3.3.1.min.js"></script>
<style>
.bgPop3{
width:30rem;
height:30rem;
color:aqua;
border:solid;
display :none;
}
.pop3{
width:20rem;
height:20rem;
color:antiquewhite;
border:solid;
display :none;
}
.m1{
width:10rem;
height:30rem;
color:rgb(0, 0, 0);
border:solid;
}
</style>
</head>
<body>
<div class="m1">
<span class="click_pop3" style="color:rgb(247, 190, 105) ">详情</span>
</div>
<div class="bgPop3" ></div>
<div class="pop3">
<span class="pop-close" style="color:rgb(247, 190, 105)">删除</span>
</div>
<script>
$(document).ready(function () {
$('.pop-close').click(function () {
$('.bgPop3,.pop3').hide();
});
$('.click_pop3').click(function () {
$('.bgPop3,.pop3').show();
});
})
</script>
</body>
</html>
觉得有用的小伙伴们,为菜鸟小飞点个赞呗。
免责声明:本站所有文章内容,图片,视频等均是来源于用户投稿和互联网及文摘转载整编而成,不代表本站观点,不承担相关法律责任。其著作权各归其原作者或其出版社所有。如发现本站有涉嫌抄袭侵权/违法违规的内容,侵犯到您的权益,请在线联系站长,一经查实,本站将立刻删除。 本文来自网络,若有侵权,请联系删除,如若转载,请注明出处:https://haidsoft.com/146397.html