jQuery掷骰子

   网上找的jQuery掷骰子效果,测试兼容IE7及以上浏览器,IE6没有测试

   

js代码如下:

 1 $(function(){
 2     var dice = $("#dice");
 3     dice.click(function(){
 4         $(".wrap").append("<div id='dice_mask'></div>");//加遮罩
 5         dice.attr("class","dice");//清除上次动画后的点数
 6         dice.css('cursor','default');
 7         var num = Math.floor(Math.random()*6+1);//产生随机数1-6
 8         dice.animate({left: '+2px'}, 100,function(){
 9             dice.addClass("dice_t");
10         }).delay(200).animate({top:'-2px'},100,function(){
11             dice.removeClass("dice_t").addClass("dice_s");
12         }).delay(200).animate({opacity: 'show'},600,function(){
13             dice.removeClass("dice_s").addClass("dice_e");
14         }).delay(100).animate({left:'-2px',top:'2px'},100,function(){
15             dice.removeClass("dice_e").addClass("dice_"+num);
16             $("#result").html("您掷得点数是<span>"+num+"</span>");
17             dice.css('cursor','pointer');
18             $("#dice_mask").remove();//移除遮罩
19         });
20     });
21 });

在线演示:demo

 

转载于:https://www.cnblogs.com/hjlost/p/6101997.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/270435.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

电脑知识:台式电脑如何使用无线网上网

❤️作者主页&#xff1a;IT技术分享社区 ❤️作者简介&#xff1a;大家好,我是IT技术分享社区的博主&#xff0c;从事C#、Java开发九年&#xff0c;对数据库、C#、Java、前端、运维、电脑技巧等经验丰富。 ❤️个人荣誉&#xff1a; 数据库领域优质创作者&#x1f3c6;&#x…

oracle的function的语法,Oracle function语法

2018-3-30 遇到需要使用SQL方法拼接字符串的情况&#xff0c;就研究了一下SQL简单的方法应用--定义入参数[参数名 in 参数类型]create or replace function p_gettype(se_type in varchar2)--定义返回类型return varchar2isv_calling_type varchar2(45);v_called_type varchar2…

进程动态优先级调度

简单的进程优先级动态调度 cup运行&#xff1a; 每执行一次&#xff0c;优先级减一&#xff0c;运行时间减一。 就绪队列中的进程&#xff1a;每次按优先级降序排序&#xff08;优先级越大越优先执行&#xff09;&#xff0c;若优先级相等再按时间升序排序&#xff08;时间越小…

电脑维修:如何给笔记本电脑升级内存条

❤️作者主页&#xff1a;IT技术分享社区 ❤️作者简介&#xff1a;大家好,我是IT技术分享社区的博主&#xff0c;从事C#、Java开发九年&#xff0c;对数据库、C#、Java、前端、运维、电脑技巧等经验丰富。 ❤️个人荣誉&#xff1a; 数据库领域优质创作者&#x1f3c6;&#x…

php动态添加查询,php动态添加url查询参数的方法,php动态url参数_PHP教程

php动态添加url查询参数的方法&#xff0c;php动态url参数本文实例讲述了php动态添加url查询参数的方法。分享给大家供大家参考。具体分析如下&#xff1a;这段代码可以动态为url添加key-value查询参数&#xff0c;如果参数已经存在则会用新的进行覆盖function add_querystring…

Object o = new Object()在内存中占几个字节

CAS&#xff1a; Compare and Swap&#xff0c;即比较再交换。 jdk5增加了并发包java.util.concurrent.*,其下面的类使用CAS算法实现了区别于synchronouse同步锁的一种乐观锁。JDK 5之前Java语言是靠synchronized关键字保证同步的&#xff0c;这是一种独占锁&#xff0c;也是…

MYSQL笔记:删除操作Delete、Truncate、Drop用法比较

今天小编给大家梳理一下MYSQL删除操作Delete、Truncate、Drop用法有什么区别&#xff0c;到底该如何合理使用&#xff0c;希望对大家能有帮助&#xff01;1、执行速度比较Delete、Truncate、Drop关键字都可以删除数据drop>truncate>delete2、原理方面2.1 deletedelete属于…

php常用函数

//php curl get获取head头部跳转参数function get_head($sUrl){$oCurl curl_init(); // 设置请求头, 有时候需要,有时候不用,看请求网址是否有对应的要求$header[] "Content-type: application/x-www-form-urlencoded";$user_agent "Mozilla/5.0 (Windows NT…

partition oracle用法,Oracle partition by 使用说明

--用法详解0、select * from wmg_test; ---测试数据1、select v1,v2,sum(v2) over(order by v2) as sum --按照 v2排序&#xff0c;累计nn-1....1from wmg_test;2、select v1,v2,sum(v2) over(partition by v1 order by v2) as sum --先分组&#xff0c;组内在进行…

SQLServer优化:SQLServer中NOLOCK关键字的用法介绍

目录 1、为什么SQLServer有NOLOCK关键字&#xff1f; 2、SQLServer有NOLOCK有什么问题 3、NOLOCK使用场景 4、nolock和with(nolock)的区别 5、表解锁脚本 1、为什么SQLServer有NOLOCK关键字&#xff1f; SQLServer没创建一个查询&#xff0c;都相当于创建一个查询会话&#xff…

20144303 20145239 实验三

20144303 20145239 实验三 实验内容 1、首先连接好实验箱电源&#xff0c;用串口线、并口线、网线、连接实验箱和主机 2、安装ADS并破解 安装文件在00-ads1.2目录下&#xff0c;破解方法在00-ads1.2\Crack目录下 3、安装GIVEIO驱动(安装文件在01-GIVEIO目录下) 把整个GIVEIO目录…

oracle无法创建监听器,关于Oracle net Manager中点击无法创建监听程序的解决方案

首先查看你的环境变量中是否有如果没有请添加该环境变量。变量名为&#xff1a;TNS_ADMIN 变量值为&#xff1a;E:\app\Administrator\product\11.2.0\dbhome_1\NETWORK\ADMIN;(如果你更改了默认目录&#xff0c;请找到相应的目录加进去)&#xff0c;添加完成之后&#xff0c;…

办公技巧:分享5个非常好用的Excel插件

❤️作者主页&#xff1a;IT技术分享社区 ❤️作者简介&#xff1a;大家好,我是IT技术分享社区的博主&#xff0c;从事C#、Java开发九年&#xff0c;对数据库、C#、Java、前端、运维、电脑技巧等经验丰富。 ❤️个人荣誉&#xff1a; 数据库领域优质创作者&#x1f3c6;&#x…

weblogic安全漫谈

今天&#xff0c;我来与大家探讨一下关于weblogic的话题 在进入内网后&#xff0c;如图&#xff1a; 当我们看到7001时&#xff0c;我们就可以测试weblogic反序列化漏洞&#xff0c;如图&#xff1a; 证明&#xff0c;漏洞存在&#xff0c;查看一下权限&#xff0c;如图&#x…

linux使进程不依赖终端,Linux nohup命令应用简介--让Linux的进程不受终端影响

nohup命令应用简介--让Linux的进程不受终端影响by:授客QQ&#xff1a;1033553122#开启ping进程[rootlocalhost ~]# pinglocalhost &[2] 4169[1]Terminatednohup ping localhost[rootlocalhost ~]# PINGlocalhost (127.0.0.1) 56(84) bytes of data.64 bytes from localhost…

电脑技巧:Win10操作系统设置定时开机图解教程

❤️作者主页&#xff1a;IT技术分享社区 ❤️作者简介&#xff1a;大家好,我是IT技术分享社区的博主&#xff0c;从事C#、Java开发九年&#xff0c;对数据库、C#、Java、前端、运维、电脑技巧等经验丰富。 ❤️个人荣誉&#xff1a; 数据库领域优质创作者&#x1f3c6;&#x…

JavaScript对UNIX时间戳的转换

<script type"text/javascript">   var timestamp 1479886513;   var d new Date(timestamp * 1000); //根据时间戳生成的时间对象   var date (d.getFullYear()) "-"     (d.getMonth() 1) "-"     (d.getDate())…