`

幸运转盘js

    博客分类:
  • js
阅读更多
function luckWheel(wheelDiv,data) {
	var round = 5,
		divisor = data.length,
		partDegree = 360/divisor,
		offset = partDegree/2,
		random = Math.floor(Math.random() * data.length),
		target = partDegree*random;
	
	wheelDiv.stopRotate();
	wheelDiv.rotate({
		angle: 0,
		duration: round*1000,
		animateTo: offset+ target + 360*round, 
		callback: function() {
			isRunning = false;
			alert(data[random]);
		}
	});
}

// 调用方式:
var data = [
	'双季丰0.1%加息红包', 
	'双季丰满减红包10元', 
	'1元现金红包', 
	'财金币20枚', 
	'20元现金红包', 
	'双季丰0.5%加息红包', 
	'双季丰满减红包50元', 
	'5元现金红包'];
luckWheel($('#luck-wheel'),data);
分享到:
评论

相关推荐

    幸运转盘抽奖-JS实现

    【标题】"幸运转盘抽奖-JS实现"指的是利用JavaScript技术来创建一个具有互动性的抽奖功能,这种功能常见于各种在线活动或者应用中,用于增加用户参与度和趣味性。抽奖通常包括用户点击启动按钮,然后转盘开始旋转,...

    Lucky Wheels幸运转盘 html5游戏项目源码JS

    Lucky Wheels幸运转盘 html5游戏项目源码js Lucky Wheels 是一款 HTML5 游戏,您可以旋转轮盘来赢得分数,它有 2 个轮盘,可以提供第二次机会来增加分数或失去全部分数。 ZIP包中包含分辨率为1280×768的游戏,可以...

    基于JavaScript的幸运大转盘

    【JavaScript的幸运大转盘实现】 在Web开发中,我们经常需要创建各种吸引用户的互动元素,其中“幸运大转盘”是一种常见的营销工具,用于抽奖或促销活动。在这个项目中,我们将探讨如何使用JavaScript和HTML5的...

    幸运转盘抽奖源码下载(php+js+flalsh)

    在幸运转盘抽奖中,JavaScript的作用包括: 1. **动画效果**:通过JavaScript实现转盘的旋转动画,提升用户体验,增加抽奖的趣味性和紧张感。 2. **用户输入验证**:检查用户的输入是否合法,如输入的抽奖次数等。 3...

    幸运大转盘源码,php转盘源码,php抽奖源码,jQuery+php实现的抽奖程序,php大转盘

    通过`js`目录中的JavaScript文件,我们可以看到如何使用jQuery编写转盘的动画效果。例如,使用`.animate()`方法实现转盘的旋转,并通过计时器控制旋转速度,以模拟真实的随机性。 接下来,PHP是后端处理的核心。在`...

    JavaScript幸运大转盘.zip

    这是一款用javascript编写的幸运大转盘,适合初学者,代码简单易懂。只有一个html首页文件和用到的js文件以及图片 可在首页调用部分修改转盘转动角度 修改代码“var a Math floor Math random 360 ;”中Math random ...

    幸运转盘源码

    "幸运转盘源码"是一个专为手机端设计的应用程序源代码,它包含了实现抽奖功能的所有必要组件。在IT行业中,这种源码通常用于构建互动式的活动或游戏,比如电商平台的促销活动,用户可以通过转动转盘来获得随机的奖品...

    幸运大转盘源码

    【幸运大转盘源码】是一种常见的互动程序,通常用于线上活动或游戏中,让用户通过转动转盘来获得随机奖励。这种源码实现了一个可视化界面,用户可以点击按钮启动转盘,转盘上的指针会旋转一段时间后停止,显示出中奖...

    Html,JQuery,JS实现幸运转盘

    总结来说,"Html,JQuery,JS实现幸运转盘"是一个综合性的前端开发实践,它涵盖了HTML的页面布局,JQuery的事件处理和动画,以及JavaScript的动态逻辑和计算。通过熟练掌握这些技术,开发者可以创造出丰富的互动体验,...

    幸运转盘代码

    【幸运转盘代码】是一种常见的互动元素,常用于游戏、抽奖活动或营销活动中,为用户提供一种随机性且有趣的方式去获取奖励。这个压缩包文件"luckystar"可能包含了一个完整的幸运转盘功能的实现代码,帮助开发者快速...

    幸运大转盘有效版

    要构建这样的幸运大转盘,开发者需要熟悉HTML、CSS和JavaScript,尤其是jQuery和动画处理。他们需要创建一个可交互的界面,设置好奖项概率,确保转盘的旋转效果自然且随机性合理。同时,为了保证用户体验,可能还...

    幸运转盘抽奖程序转盘与指针

    【幸运转盘抽奖程序转盘与指针】是一种常见的互动抽奖应用,常见于各种线上线下活动中。这个程序的核心设计包括两个关键元素:转盘和指针。转盘是抽奖的视觉焦点,通常被设计成带有多个扇区,每个扇区代表不同的奖项...

    基于js,javaScript的幸运转盘大抽奖小程序

    1. 基于js,javaScript的幸运转盘大抽奖小程序,可用于毕业设计。代码结构清新,代码有注释。可重新定制开发或者学习。 2. 说明: 微信小程序转盘抽奖 (1) 简介 用微信小程序开发的Canvas绘制可配置的转盘抽奖。 ...

    幸运大转盘

    这个项目旨在提供一种娱乐方式,用户可以通过点击按钮启动一个类似幸运转盘的界面,展示各种可能的结果。接下来,我们将深入探讨这个项目涉及的技术细节和知识点。 首先,JavaScript作为网页的动态语言,是实现...

    中秋节幸运大转盘抽奖手机页面.rar

    中秋节幸运大转盘抽奖手机页面.rar 中秋节幸运大转盘抽奖手机页面.rar 中秋节幸运大转盘抽奖手机页面.rar 中秋节幸运大转盘抽奖手机页面.rar 中秋节幸运大转盘抽奖手机页面.rar 中秋节幸运大转盘抽奖手机页面.rar ...

    tmdit抽奖flash幸运大转盘插件

    【TMDit抽奖Flash幸运大转盘插件】是一款用于创建互动式抽奖活动的专业工具,主要基于Adobe Flash技术。在过去的网页设计中,Flash被广泛应用于动态效果展示和交互式内容制作,这款插件就是其中之一。它允许用户通过...

    幸运大转盘抽奖码 2.9.0 支持大转盘 九宫格

    更新了积分抽奖功能,可设置(每日/总)赠送次数,(每日/总)分享赠送次数。 赠送次数消耗完后,可以...优化转盘的优惠券,实物奖品图片显示,用js控制图片高度以免图片高度过高,导致商家名和奖品名称显示不出来。

    基于HTML5 小游戏 幸运大转盘

    在幸运大转盘游戏中,Canvas就是画布,开发者通过JavaScript控制画笔在Canvas上绘制转盘的各个部分,包括转盘的背景、指针、奖品区域等。 JavaScript在这个过程中扮演了控制游戏逻辑的角色。例如,点击开始按钮后,...

Global site tag (gtag.js) - Google Analytics