jQuery实现弹窗效果
点击弹窗按钮,弹出如下界面,点击取消和右上角的X则取消:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<link rel="stylesheet" href="./css/main.css">
<script src='../js/jquery-1.12.4.js'></script>
<script>
$(function(){
$('#btn').click(function(){
//显示弹窗的主界面
$('.pop_main').show()
//设置animate动画初始值
$('.pop_con').css({'top':0,'opacity':0})
$('.pop_con').animate({'top':'50%','opacity':1})
})
//取消按钮和关闭按钮添加事件
$('.cancel,.pop_title a').click(function(){
$('.pop_con').animate({'top':0,'opacity':0},function(){
//隐藏弹窗的主界面
$('.pop_main').hide()
})
})
})
</script>
</head>
<body>
<input type="button" value="弹出弹框" id="btn">
<div class="pop_main">
<div class="pop_con">
<div class="pop_title">
<h3>系统提示</h3>
<a href="#">×</a>
</div>
<div class="pop_detail">
<p class="pop_text">亲!确定要这么做吗?</p>
</div>
<div class="pop_footer">
<input type="button" value="取 消" class="cancel">
<input type="button" value="确 定" class="confirm">
</div>
</div>
<div class="mask"></div>
</div>
</body>
</html>
M1r4n: python中给定两个列表,怎么找出他们相同的元素和不同的元素?值得学习,非常受益,期待qq_40808154的下一篇文章
M1r4n: python中给定两个列表,怎么找出他们相同的元素和不同的元素?值得学习,非常受益,期待qq_40808154的下一篇文章
Joey_96: 请问我用这个方法为什么一直报错说name b is not defined呢?
缙北尘: 谢谢哥,一步到位,直接成功运行
Jamesgender: 我有点不太记得我当初为啥在这个问题下面评论了,我是win系统,win系统的numworkers一般都有问题。别的原因可能是上github上找到的,你可以看看