<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> | |
<html xmlns="http://www.w3.org/1999/xhtml"> | |
<head> | |
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> | |
<title>无标题文档</title> | |
<style> | |
.pop-body { | |
display: none; | |
background: #000; | |
position: absolute; | |
z-index: 1000; | |
top: 0; | |
left: 0; | |
opacity: 0.5; | |
} | |
.pop-home { | |
background: #FFF; | |
position: fixed; | |
top: 50%; | |
left: 50%; | |
margin-top: -150px; | |
margin-left: -150px; | |
width: 300px; | |
height: 300px; | |
display: none; | |
z-index: 1100; | |
} | |
.pop-home span { | |
font-size: 30px; | |
position: absolute; | |
top: 10px; | |
right: 10px; | |
cursor: pointer; | |
} | |
</style> | |
</head> | |
<body> | |
<div class="dianji">点击</div> | |
<div class="pop-body"></div> | |
<div class="pop-home"> | |
<span>×</span> | |
<div class="form"><label>奖励积分为:</label><input type="text" /><button class="tijiao">提交</button></div> | |
<div class="zongfen">5000</div> | |
</div> | |
<script src="jq源代码/jquery-3.1.0.js" type="text/javascript"></script> | |
<script src="jq源代码/jquery-3.1.0.min.js" type="text/javascript"></script> | |
<script> | |
$('.dianji').click(function(){ | |
var w=$(window).width() | |
var h=$(window).height() | |
$('.pop-body').show().css({width:w,height:h}) | |
$('.pop-home').show() | |
$('body').css('overflow','hidden') | |
}); | |
//点击关闭 | |
$('.pop-home span,.pop-body').click(function(){ | |
$('.pop-body,.pop-home').hide() | |
$('body').css('overflow','auto') | |
}); | |
$('.tijiao').click(function(){ | |
var a=$('.form input').val() | |
var b=$('.zongfen').text() | |
var c=parseInt(a) | |
var d=parseInt(b) | |
if(a==""){ | |
alert("请输入积分"); | |
return false; | |
} | |
z=d-c | |
$('.zongfen').text(z) | |
}); | |
</script> | |
</body> | |
</html> | |
jquery打赏功能
最新推荐文章于 2021-06-08 11:07:22 发布