最新赞助活动温馨提示:自愿赞助服务器费用,学生和没有工作的整站资源免费下载!
头像

jQuery摇红包中奖代码

来源:http://www.erdangjiade.com/ 沐浴春风 2016-08-04 07:20浏览(1911)

这是一款html5手机红包抽奖效果,你可以简单的应用在活动抽奖上,比如双十一咯。点击红包摇一摇,看看中了什么大奖,千万别找二当家的要哦。

0、请不要问“在不在”之类的问题,有问题直接问!1、学生或暂时没有工作的童鞋,整站资源免费下载!2、¥9.9充值终身VIP会员,加我微信,826096331 拉你进VIP群学习!3、程序员加油,技术改变世界。在线 充值

jQuery摇红包中奖代码
分类:html5 > 摇一摇 难易:初级
查看演示

加我微信,拉你进VIP群学习:

下载资源 下载积分: 30 积分

html

<div class="red">
    <button class="redbutton" type="领取红包">拆红包</button>
    <div class="red-jg">
        <h1>恭喜您!</h1>
        <h5>获得iPhone 6plus 64g手机一部</h5>
    </div>
</div>
<div class="t-btn">
    <button>立即领取</button>
</div>
// 点击redbutton按钮时执行以下全部
    $('.redbutton').click(function(){
        // 在带有red样式的div中添加shake-chunk样式
        $('.red').addClass('shake-chunk');
        // 点击按钮2000毫秒后执行以下操作
        setTimeout(function(){
            // 在带有red样式的div中删除shake-chunk样式
            $('.red').removeClass('shake-chunk');
            // 将redbutton按钮隐藏
            $('.redbutton').css("display" , "none");
            // 修改red 下 span   背景图
            $('.red > span').css("background-image" , "url(img/red-y.png)");
            // 修改red-jg的css显示方式为块
            $('.red-jg').css("display" , "block");
        },2000);
    });
声明:本文为原创文章,如需转载,请注明来源erdangjiade.com并保留原文链接:https://www.erdangjiade.com/js/923.html
评论1
头像

友情提示:垃圾评论一律封号 加我微信:826096331拉你进VIP群学习群

  • 头像 沙发
    09-29 14:43
    dombook
    哇塞,非常棒
1 2