Jquery仿彩票更换数字动画效果
<script type="text/javascript" src="jquery-1.11.3.min.js"></script>
<script type="text/javascript">
jQuery(document).ready(function($) {
var y=3;
$("input").click(function(event) {
$("ul li").each(function(index, el) {
///开始///随机函数
function createRandom(num ,from ,to )
{
var arr=[];
for(var i=from;i<=to;i++)
arr.push(i);
arr.sort(function(){
return 0.5-Math.random();
});
arr.length=num;
return arr;
} function createRandom2(num , from , to)
{
var arr=[];
var json={};
while(arr.length<num)
{
//产生单个随机数
var ranNum=Math.ceil(Math.random()*(to-from))+from;
//通过判断json对象的索引值是否存在 来标记 是否重复
if(!json[ranNum])
{
json[ranNum]=1;
arr.push(ranNum);
}
}
return arr;
}
///结束///随机函数
var arr=[];//声明一个空的数组
arr=createRandom2(7,1,33)/*将随机生成的0-33的7个数字赋值给arr*/
//定义了sort的比较函数将arr数组里面的数字
arr.sort(function(a,b){
return a-b;
});
//利用循环让每个li取到arr数组的值
for(var i=0;i<=$("ul li").size();i++){
$("ul li").eq(i).text(arr[i]);
}
/*每个圆转的度数等于 y*360*/
y++;
$("ul li").eq(index).css({
"transform": 'rotate('+y*360+'deg)',
"-moz-transform": 'rotate('+y*360+'deg)',
"-webkit-transform": 'rotate('+y*360+'deg)',
"-o-transform": 'rotate('+y*360+'deg)',
"-s-transform": 'rotate('+y*360+'deg)'
});
});
//判断随机生成的是不是小于10如果是的就给前面加上0如生成的是1那么就显示01
$("ul li").each(function(index, el) {
if (parseInt($(this).text())<10) {
var cc=$(this).text();
$(this).text("0"+cc)
};
});
});
});
</script>
Jquery仿彩票更换数字动画效果的更多相关文章
- javascript仿天猫加入购物车动画效果
javascript仿天猫加入购物车动画效果 注意:首先需要声明的是:代码原思路不是我写的,是在网上找的这种效果,自己使用代码封装了下而已:代码中都有注释,我们最主要的是理解抛物线的思路及在工作中 ...
- Jquery库自带的动画效果方法记录
1.显示和隐藏hide()和show() <script type="text/javascript"> $(function() { ...
- JQuery实现的模块交换动画效果
<!doctype html> <html> <head> <meta http-equiv="content-type" content ...
- 基于jQuery CSS3鼠标点击动画效果
分享基于jQuery CSS3鼠标点击动画效果支持图片或内容滑动,允许设置动画延迟效果.效果图如下: 在线预览 源码下载 实现的代码. html代码: <div class="co ...
- 仿网易nec首页动画效果
仿网页nec首页动画效果nec链接:http://nec.netease.com/ 首先,介绍animationanimation检索或设置对象所应用的动画特效.animation由“keyframe ...
- jquery仿搜狐投票动画代码
体验效果:http://hovertree.com/texiao/jquery/21/ 这是一款基于jquery实现的仿搜狐投票动画特效源码,运行该源码可见VS图标首先出现在中间位置,紧接着随着投票比 ...
- jquery 仿手机屏幕切换界面效果
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- jquery使用CSS3实现文字动画效果插件Textillate.js
Textillate是一款基于jquery的使用CSS3实现文字动画的小巧插件.Textillate.js集成了一些很棒的使用CSS3动画效果的 JavaScript 库,您可非常轻轻松地把这些动画效 ...
- JQuery模拟实现天猫购物车动画效果
测试程序源代码下载地址:源码 一.功能描述: 1.点击购买按钮,模拟抛物线将物品弹到购物车里: 2.购物车添加物品后,显示+1动画: 效果图如下: 实现如下: 1.导入jquery相关的包: < ...
随机推荐
- 当执行太多不受信任的代码时,除去令人讨厌的大量 trycatch 的办法
如果方法 Condition 返回 true,则执行 IfTrue,否则执行 IfFalse,发生异常则执行 IfError. 通常是这样: try { if (Condition()) { try ...
- 版本控制简介,git使用----使用GitHub托管代码
关于版本控制: 很久以前,人们苦于对写过的代码进行版本的管理,经常过了一段时间想恢复原来写过的代码却又忘了不知道丢到哪儿去了,有的人用加上时间后缀来命名文件的方法,便于后期维护,但是这样做的麻烦也很大 ...
- Selenium VS QTP
Selenium系列 QTP 适用结构 B/S结构 C/S.B/S结构 适用人员 有一定代码基础(Java.C#.Python.Ruby) 对编程不是很熟悉的.厌烦了做手工功能测试的.想快速进 ...
- Linux Shell 学习总结
1. -bash: ./dd.sh: /bin/bash^M: bad interpreter: 没有那个文件或目录 当出现上面这问题的时候,首先看你的.profile 里面是否配置对了,一般配置为: ...
- js正则表达式大全(2)
在JAVASCRIPT里面判断一个字符串是否是电子邮件的格式: if(formname.email.value!=formname.email.value.match(/^\w +[@]\w +[.] ...
- web.config连接字符串的一些总结
阅读目录: DS01:数据库连接字符串的两种写法 DS02:数据库连接字符串的内容 DS01:数据库连接字符串的两种写法 1.连接字符串的两种写法: <configuration> & ...
- LCM在Kernel中的代码分析
lcm的分析首先是mtkfb.c 1.mtk_init中platform_driver_register(&mtkfb_driver)注册平台驱动 panelmaster_init(); DB ...
- running programmer——spring-01(初谈spring)
今天主要是通过一个简单的登录程序学习一些spring做基础的配置和功能. I.spring的核心配置applicationContext.xml 关于bean的配置官方给出的最基础的配置文件如下: & ...
- delphi中线程应用之Synchronize
当一个线程在使用时,如果这个函数使用了Synchronize修钸的话就不允许别一个线程来调用这个函数,它的目的是避免多个子线程同时访问主线程资源.示例:procedure TTaskThread.Sh ...
- oracle数据库表空间追加数据库文件方法
oracle数据库表空间追加数据库文件方法 针对非大文件方式表空间,允许追加文件进行表空间的扩展,单个文件最大大小是32G 第一种方式:表空间增加数据文件 www.2cto.com 1 ...