其中拖拽刮涂层效果使用jquery UI的draggable方法
以下是源代码：
复制代码 代码如下:
<!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>
<title>jQuery UI模拟刮彩票涂层显示结果</title>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<style type="text/css">
#keleyi{width:200px;height:20px;position:relative;text-align:center;font-size:12px;overflow:hidden;background:#eee;}
#keleyi div{position:absolute;top:0px;left:0px;width:100%;height:20px;background:#ccc;}
#layout2{width:200px;height:20px;position:relative;text-align:center;font-size:12px;overflow:hidden;background:#eee;}
#layout2 div{position:absolute;top:0px;right:0px;width:100%;height:20px;background:#ccc;}
</style>
<script type="text/javascript" src="/UploadFiles/2021-04-02/jquery-1.11.0.min.js">
<script src="http://keleyi.com/keleyi/pmedia/jquery/ui/1.10.3/js/jquery-ui-1.10.3.min.js">
<script type="text/javascript">
$(document).ready(function() {
$("#keleyi div").draggable({
revert:function() {
var a = $("#keleyi div").offset().left;
var b = $("#kel"+"eyi").width();
if (a >= b) {
$("#keley"+"i").text("恭喜您获得5000万美元大奖！").css("color","red").fadeOut(200).fadeIn(500);
return false;
}else{
return true;
}
},
axis: "x", snap: "#keleyi", scroll: false}
);
$("#layout2 div").click(function() {
$(this).animate({
width : "+=20",
}).animate({
width : "-=50",
});
if ($(this).width() <= 30) {
$("#layout2").text("恭喜您获得5000万美元大奖！").css("color","red").fadeOut(200).fadeIn(500);
}
});
});
</script>
</head>
<body>
<div>说明：不支持IE6！</div>
<p> </p>
<p>效果一（拖拽灰条）：</p>
<div id="keleyi">
<div></div>
请完全刮开查看中奖结果。
</div>
<p> </p>
<p>效果二（点击灰条）：</p>
<div id="layout2">
<div></div>
请完全刮开查看中奖结果。
</div>
<br />
</body>
</html>
这里给大家分享的是十分常用的刮奖的特效代码，希望小伙伴们能够喜欢。
jQuery,刮刮卡
P70系列延期，华为新旗舰将在下月发布
3月20日消息，近期博主@数码闲聊站 透露，原定三月份发布的华为新旗舰P70系列延期发布，预计4月份上市。
而博主@定焦数码 爆料，华为的P70系列在定位上已经超过了Mate60，成为了重要的旗舰系列之一。它肩负着重返影像领域顶尖的使命。那么这次P70会带来哪些令人惊艳的创新呢？
根据目前爆料的消息来看，华为P70系列将推出三个版本，其中P70和P70 Pro采用了三角形的摄像头模组设计，而P70 Art则采用了与上一代P60 Art相似的不规则形状设计。这样的外观是否好看见仁见智，但辨识度绝对拉满。