css代码：

<style type="text/css">

	#div1{ width:200px; height:200px; background-color:orange; border:solid 5px #f0f0f0;  position:absolute; left:600px; top:200px;}

</style>

js代码：

<script type="text/javascript">

	window.onload=function(){

	　　var oDiv=document.getElementById('div1');

	　　oDiv.onclick=function(){

		shake(oDiv,'left');

	　　}

	}

	//封装抖动方法

	function shake(obj,attr){

	　　var arr=[];

	　　var timer=null;

	　　var num=0;

	　　var pos=parseInt(getStyle(obj,attr));		

	　　//通过数组实现抖动的频率

	　　for(var i=20;i>0;i-=2){

	　　　　arr.push(i,-i);

	　　}

	　　arr.push(0);

	　　//设置定时器实现抖动

	　　clearInterval(timer);

	　　timer=setInterval(function(){

	　　　　obj.style[attr]=pos+arr[num]+'px';

	　　　　num++;

	　　　　if(num==arr.length){

		clearInterval(timer);

	　　　　}

	　　},20)

	}

	//获取元素属性方法

	function getStyle(obj,attr){

	　　return obj.currentStyle?obj.currentStyle[attr]:getComputedStyle(obj,null)[attr];

	}

</script>

HTML：

<body>

	<div id="div1"></div>

</body>

javascript提示抖动实现方法的更多相关文章

  1. JavaScript常用对象的方法和属性

    ---恢复内容开始--- 本文将简单介绍JavaScript中一些常用对象的属性和方法,以及几个有用的系统函数. 一.串方法 JavaScript有强大的串处理功能,有了这些串方法,才能编写出丰富多彩 ...

  2. JavaScript弹出窗口方法

    本文实例汇总了常用的JavaScript弹出窗口方法,供大家对比参考,希望能对大家有所帮助.详细方法如下: 1.无提示刷新网页: 大家有没有发现,有些网页,刷新的时候,会弹出一个提示窗口,点“确定”才 ...

  3. ASP.NET MVC异步验证是如何工作的01,jQuery的验证方式、错误信息提示、validate方法的背后

    ASP.NET MVC借助jQuery的验证机制,提供了一套从客户端到服务端异步验证的解决方案,通常情况下,用起来相当方便.但面对一些相对特殊的情况,可能会遇到验证失效的场景,比如在使用ajax动态异 ...

  4. 【转】 C#后台调用前台javascript的五种方法

    第一种,OnClientClick    (vs2003不支持这个方法)<asp:ButtonID="Button1" runat="server" Te ...

  5. Android和JavaScript相互调用的方法

    转载地址:http://www.jb51.net/article/77206.htm 这篇文章主要介绍了Android和JavaScript相互调用的方法,实例分析了Android的WebView执行 ...

  6. JavaScript document属性和方法

    JavaScript document属性和方法 --------------------------------------------属性: 1. Attributes     存储节点的属性列表 ...

  7. 将JavaScript 插入网页的方法

    将JavaScript 插入网页的方法 使用Javascript代码. 插入JavaScript 与在网页中插入CSS的方式相似.使用下面的代码可以在网页中插入JavaScript: ... 其中的. ...

  8. wamp出现You don’t have permission to access/on this server提示的解决方法

    本地搭建wamp 输入http://127.0.0.1访问正常,当输入http://localhost/ apache出现You don't have permission to access/on ...

  9. js 判断数组包含某值的方法 和 javascript数组扩展indexOf()方法

    var  questionId = []; var anSwerIdValue = []; ////javascript数组扩展indexOf()方法 Array.prototype.indexOf ...

随机推荐

  1. 洛谷P1364 医院设置

    LITTLESUN的第一道图论,撒花~~ 题目链接 这道题是Floyd的板子题 注意对于矩阵图的初始值赋值要全部赋值成最大值 十六进制的最大值表示方式是0x3f3f3f3f memset(G,0x3f ...

  2. redis入门：介绍、特点、安装、各类型常用操作

    一.redis介绍 Redis 是一个开源(BSD许可)的,内存中的数据结构存储系统,它可以用作数据库.缓存和消息中间件. Redis支持多种类型的数据结构,如 字符串(strings), 散列(ha ...

  3. (原)Android到IOS开发的转换（一）

    序)闲扯几句 很早就想入手ios开发,但是一直没有机会,个人没有水果机器,上个公司上班的那台mac mini虽然就在我身边,灰都有一层了,但是一直没有机会开机学习下,因为事多,自上一篇文章后,离职后, ...

  4. 「暑期训练」「Brute Force」 Restoring Painting （CFR353D2B）

    题意 给定一定条件,问符合的矩阵有几种. 分析 见了鬼了,这破题谁加的brute force的标签,素质极差.因为范围是1e5,那你平方(枚举算法)的复杂度必然爆. 然后你就会思考其中奥妙无穷的数学规 ...

  5. 【赛后补题】(HDU6223) Infinite Fraction Path {2017-ACM/ICPC Shenyang Onsite}

    场上第二条卡我队的题目. 题意与分析 按照题意能够生成一个有环的n个点图(每个点有个位数的权值).图上路过n个点显然能够生成一个n位数的序列.求一个最大序列. 这条题目显然是搜索,但是我队在场上(我负 ...

  6. 《百词斩·象形9000》第一册（上） 符号Symbol 1

    001-upon prep. 在......上面 Wish upon a star.#对着星星许愿. 002-think V. 想,思索,认为:以为,预料 What do you think?#你认为 ...

  7. linux常用命令补充详细

    1.ls命令 就是list的缩写,通过ls 命令不仅可以查看linux文件夹包含的文件,而且可以查看文件权限(包括目录.文件夹.文件权限)查看目录信息等等 常用参数搭配: ls -a 列出目录所有文 ...

  8. CVPR2018: Generative Image Inpainting with Contextual Attention 论文翻译、解读

    注:博主是大四学生,翻译水平可能比不上研究人员的水平,博主会尽自己的力量为大家翻译这篇论文.翻译结果仅供参考,提供思路,翻译不足的地方博主会标注出来,请大家参照原文,请大家多多关照. 转载请务必注明出 ...

  9. 小心！FOMO3D的坑

    null 01 前方高能 近日,区块链机构安比(SECBIT)实验室审计后确认,FOMO3D游戏的智能合约存在随机数漏洞可被利用,FOMO3D合约及所有抄袭源码的山寨合约均存在该安全漏洞. 原本设计上 ...

  10. 腾讯云，搭建 FTP 文件服务

    腾讯云,搭建 FTP 文件服务 腾讯云,搭建 FTP 文件服务 安装并启动 FTP 服务 任务时间:5min ~ 10min 安装 VSFTPD 使用 yum 安装 vsftpd: yum insta ...