摇股子就是用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. MVC 文件上传问题

    在用MVC作文件上传处理时,最开始是这样的. html代码 <div id="dialog" title="Upload files">       ...

  2. (三)Netty源码学习笔记之boss线程处理流程

    尊重原创,转载注明出处,原文地址:http://www.cnblogs.com/cishengchongyan/p/6160194.html  本文我们将先从NioEventLoop开始来学习服务端的 ...

  3. Transaction (Process ID xxx) was deadlocked on lock

    Transaction (Process ID 161) was deadlocked on lock | communication buffer resources with another pr ...

  4. eclipse工具常用快捷键总结

    1.  ctrl + shift + r  可以根据类名快速找到你所需要的类名称 2.  ctrl + shift + i  debug的时候可以查看代码的值 3.  ctrl + shift + f ...

  5. C++ 字符处理函数

    C/C++里有一个头文件#include <ctype.h>,里面定义了很多字符函数,在实际开发中,用起来很方面. int isalpha(int ch)  若ch是字母('A'-'Z', ...

  6. JAVASCRIPT常用API总结

    目录 元素查找 class操作 节点操作 属性操作 内容操作 css操作 位置大小 事件 DOM加载完毕 绑定上下文 去除空格 Ajax JSON处理 节点遍历 元素查找 // Node docume ...

  7. SimpleXML操控XML

    复杂字符串如下: $_xml=<<<_xml <?xml version="1.0" encoding="utf-8"?> < ...

  8. C#事件的理解应用

    之前对C#的事件理解的不够透彻,总是感觉在实际应用上差一些火候.最近写character类的相关内容,有了一些理解,在这里分享一下. &感觉大神没必要往下看了 下面开始正式内容: 比如说,角色 ...

  9. 安天移动安全应对“DressCode”威胁,发布企业移动威胁检查工具

    近日,一种名为"DressCode"的恶意代码引起了国内安全行业的关注,该恶意代码以企业员工的移动设备作为跳板对企业内网进行攻击,对企业安全造成严重威胁.安天移动安全公司威胁情报团 ...

  10. 【Java EE 学习 83 下】【SpringMVC】【使用注解替代已过时的API】【SpringMVC、Hibernate整合】

    一.SpringMVC中注解的使用 1.为什么要使用注解 之前曾经提到过的三种控制器在spring3.0中都已经被明确标记为过时了,spring3.0推荐使用注解的方式替代三种控制器,实际上使用注解的 ...