随便撸(www.suibianlu.com)精品网站源码,织梦建站模版,游戏源代码分享平台
当前位置:网站首页 js特效 名站特效 正文

jQuery仿淘宝彩票换一注动画效果特效

时间:2019-04-24 [名站特效]作者:木子10086

jQuery仿淘宝彩票换一注动画效果特效 第1张

jQuery仿淘宝彩票换一注动画效果特效,IE8以下浏览器不支持动画旋转效果。


JS代码



<script type="text/javascript" src="jquery-1.11.2.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仿淘宝彩票换一注动画效果特效

本文永久链接地址:https://www.suibianlu.com/14045.html

郑重声明:
本站所有内容均由互联网收集整理、网友上传,并且以计算机技术研究交流为目的,仅供大家参考、学习,不存在任何商业目的与商业用途。
若您需要商业运营或用于其他商业活动,请您购买正版授权并合法使用。 我们不承担任何技术及版权问题,且不对任何资源负法律责任。
如无法链接失效或侵犯版权,请给我们来信:admin@suibianlu.com

Top