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

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

效果图如下:

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

代码如下:

   

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

JavaScript摇股子的更多相关文章

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

    http://www.helloweba.com/view-blog-287.html HTML5有一个重要特性:DeviceOrientation,它将底层的方向和运动传感器进行了高级封装,它使我们 ...

  2. JavaScript性能优化之摇树

    作者|Jeremy Wagner译者|薛命灯 现代 Web 应用程序可能会变得非常巨大,特别是它们的 JavaScript 部分.HTTP Archive 网站的数据显示,截至 2018 年中,传输到 ...

  3. 用JavaScript+HTML实现双色球随机摇号效果

    用JavaScript+HTML实现双色球随机摇号效果 首先要知道双色球的规则是什么 双色球投注区分为红球号码区和蓝球号码区 红球号码范围为01-33,蓝球号码范围为01-16 双色球每期从33个红球 ...

  4. Javascript网页摇一摇

    function init(){ if (window.DeviceMotionEvent) { // 移动浏览器支持运动传感事件 window.addEventListener('devicemot ...

  5. 使用JAVAScript技术在WEB网页实现摇一摇的应用

    实现效果如下: 代码如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset=& ...

  6. H5实现摇一摇技术总结

    摇一摇遇到的问题 一.如何对摇晃效果进行反馈 刚开始的处理方式是,摇晃过程中不做任何处理,但后来反馈说这种效果不好,好像就没有摇动一样,如果声音也不响的话,就真的和什么都没发生一样. 后来想了想,加入 ...

  7. C#开发微信门户及应用(38)--微信摇一摇红包功能

    摇一摇周边红包接口是为线下商户提供的发红包功能.用户可以在商家门店等线下场所通过摇一摇周边领取商家发放的红包.我曾经在<C#开发微信门户及应用(28)--微信“摇一摇·周边”功能的使用和接口的实 ...

  8. 悟透JavaScript(理解JS面向对象的好文章)

    引子 编程世界里只存在两种基本元素,一个是数据,一个是代码.编程世界就是在数据和代码千丝万缕的纠缠中呈现出无限的生机和活力. 数据天生就是文静的,总想保持自己固有的本色:而代码却天生活泼,总想改变这个 ...

  9. H5摇一摇遇到的问题

    一.如何对摇晃效果进行反馈 刚开始的处理方式是,摇晃过程中不做任何处理,但后来反馈说这种效果不好,好像就没有摇动一样,如果声音也不响的话,就真的和什么都没发生一样. 后来想了想,加入摇晃过程动画,就像 ...

随机推荐

  1. hdu 1878

    http://acm.hdu.edu.cn/showproblem.php?pid=1878 题意:就是判断这个图是不是一个欧拉回路的一个题, 思路:我觉得这个题可以用并查集判环加上判断每个点的度就行 ...

  2. xtrabackup 使用说明(续)

    背景: 关于物理备份工具xtrabackup的一些说明可以先看之前写过的文章说明:xtrabackup 安装使用.现在xtrabackup版本升级到了2.4.4,相比之前的2.1有了比较大的变化:in ...

  3. CodeIgniter 3 源码学习笔记《一》

    CodeIgniter 是一套给 PHP 网站开发者使用的应用程序开发框架和工具包. 它的目标是让你能够更快速的开发,它提供了日常任务中所需的大量类库, 以及简单的接口和逻辑结构.通过减少代码量,Co ...

  4. Gnome_Terminal

    快捷键 ctrl shift m 我自定义的快捷键,可以给终端命名 ctrl shift t 新建标签页,并且目录为当前目录 ctrl shift pageup 标签页往前移 ctrl shift p ...

  5. Xcode7下模拟器输入文本无法显示系统键盘的解决办法

    xcode7下的ios模拟器输入内容无法系统键盘,只能用电脑键盘输入内容,这样可能会对调试带来麻烦. 其实xcode7下的ios模拟器默认只能使用一种,要么是模拟器系统键盘,要么就是是电脑键盘.设置方 ...

  6. mybatis Oracle 批量插入,批量更新

    传入的参数只要是list类型的参数就行了..............1.批量插入<insert id="insertBatch" parameterType="ja ...

  7. Java注解基础概念总结

    注解的概念 注解(Annotation),也叫元数据(Metadata),是Java5的新特性,JDK5引入了Metadata很容易的就能够调用Annotations.注解与类.接口.枚举在同一个层次 ...

  8. Tomcat绑定IPV4端口

    使用下面的方法可以绑定到IPV4, 在<tomcat>/bin目录下新建setenv.sh,如果没有话,然后添加如下内容: JAVA_OPTS="$JAVA_OPTS -Djav ...

  9. vue.js 接收url参数

    1) 路由配置传参方式 在配置路由时 例如 "/firewall/authorize/:uid/:uname/:token" 页面url为 http://XXX.com/firew ...

  10. Django框架-目录文件简介

    Rhel6.5 Django1.10 Python3.5 Django框架-目录文件简介 1.介绍Django Django:一个可以使Web开发工作愉快并且高效的Web开发框架. 使用Django, ...