JavaScript摇股子

摇股子就是用javascript实现的一个简单的小特效。

下面来看一下我自己做的一个用javascript实现的摇股子。

效果图如下：

我做的股子是由6张图片，点击股子它自己会随机晃动。

代码如下：

案例思路：给三张图片都加一个点击函数，给三张图片一个循环，让这六张图片一直循环显示出来，在script里面获取div的id和三张图片，给图片一个开始点击的函数和停止点击的函数，然后给图片一个随机函数，让它能随机切换，最后给它了一个停止的时候显示的一个数值的判断。

时间： 2024-11-08 08:57:01

JavaScript摇股子的相关文章

HTML5手机重力与方向感应的应用——摇一摇效果

http://www.helloweba.com/view-blog-287.html HTML5有一个重要特性:DeviceOrientation,它将底层的方向和运动传感器进行了高级封装,它使我们能够很容易的实现重力感应.指南针等有趣的功能.本文将结合实例给大家介绍使用HTML5的重力运动和方向传感器实现手机摇一摇效果. DeviceOrientation包括两个事件: 1.deviceOrientation:封装了方向传感器数据的事件,可以获取手机静止状态下的方向数据,例如手机所处角度.方

JavaScript性能优化之摇树

作者|Jeremy Wagner译者|薛命灯现代 Web 应用程序可能会变得非常巨大,特别是它们的 JavaScript 部分.HTTP Archive 网站的数据显示,截至 2018 年中,传输到移动设备上的 JavaScript 文件中值大约为 350 KB.而这只是传输大小,JavaScript 在通过网络传输时通常会被压缩,也就是说,在浏览器端解压后,JavaScript 的实际数量会更多. 从资源处理方面来看,压缩并不会给资源处理带来任何好处,比如 900 KB 的 JavaScri

微信摇一摇红包

功能介绍 2015年9月份左右微信摇一摇周边开放了"摇一摇红包组件接口",具备开发能力的用户,可以调用该接口进行功能开发.摇一摇红包功能通过简便的操作方式减少用户的操作层级.优化了用户的互动体验,并且趣味性地留存了用户和促进了品牌推广,参与活动的用户仅需在ibeacon设备蓝牙广播范围内打开手机蓝牙,进入微信摇一摇,等待出现"周边"入口,即可摇到现金红包,用户点击拆开红包,直接转入微信零钱包并且默认用户关注了公众号. 用户领取红包流程现在,跟着一起,来体验

利用 JavaScript 快速切换正体中文和简体中文

一般商业网站都有一个语言的需求,就是为了照顾使用正体中文的国人,会特地提供一个切换到正体中文的选项(或曰"繁体中文").传统做法是在服务端完成的,即通过某些控件或者过滤器转换文本语言.这里笔者介绍一种简单可行的方法,不是在服务端而是利用前端的 JavaScript 就可以切换正体中文. 大概六年前我还专门写过这议题的博文,这篇也是奠基在那篇文章(旧文也是参考了一高手代码)之上,<对 JavaScript 繁简字切换的小改进>.时过境迁,有必要把代码进行更新一下--以前的太稚

悟透JavaScript

From: 李战,http://www.cnblogs.com/leadzen/archive/2008/02/25/1073404.html 引子编程世界里只存在两种基本元素,一个是数据,一个是代码.编程世界就是在数据和代码千丝万缕的纠缠中呈现出无限的生机和活力. 数据天生就是文静的,总想保持自己固有的本色:而代码却天生活泼,总想改变这个世界. 你看,数据代码间的关系与物质能量间的关系有着惊人的相似.数据也是有惯性的,如果没有代码来施加外力,她总保持自己原来的状态.而代码就象能量,他存

html5 web 摇一摇切换歌曲

1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="utf-8" /> 5 <meta name="viewport" content="width=device-width, initial-scale=1.0" /> 6 <title>摇一摇功能</title> 7

微信企业号开发:微信考勤摇一摇考勤

看到网上又不好微信企业号的摇一摇考勤,自己也想做一个,但查遍了微信企业号文档,也没有看到摇一摇的相关API,本以为做不出来了,想不到再问了同事后,才知道其实很简单,摇一摇不需要微信企业号的文档,HTML5就有,摇一摇其实就是相当于点击了保存按钮而已. 其实获取地理位置HTML5也支持. HTML5 - 使用地理定位 <script> var x=document.getElementById("demo"); function getLocation() { if (nav

转载悟透JavaScript

博客园专题介绍:http://book.cnblogs.com/zt/wtjs/ 博客园购买网址: http://www.hjbook.net/product/3411/ 网络书店购买网址:http://www.china-pub.com/301666 亲笔签名书专门店:http://shop36954457.taobao.com/ 引子编程世界里只存在两种基本元素,一个是数据,一个是代码.编程世界就是在数据和代码千丝万缕的纠缠中呈现出无限的生机和活力. 数据天生就是文静的,总想保持自己固有的

利用HTML5的devicemotion事件实现手机摇一摇抽奖，年会抽奖

摇一摇JS脚本逻辑:接下来是移动端JS脚本逻辑的实现,摇一摇的实现需借助html5新增的devicemotion事件,获取设备在位置和方向上的改变速度的相关信息,该事件的基本使用如下: if (window.DeviceMotionEvent) { window.addEventListener('devicemotion', handler, !1); lastTime = new Date(); } else { alert('你的浏览器不支持摇一摇功能.'); } devicemotion