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. 販売管理(SD)

    SD(販売管理)系のSAP DBテーブル. 随時更新していきます. [得意先マスタ]KNA1: 一般データ KNB1: 会計データ KNBK: 銀行データ KNVV: 販売データ KNVP: 取引先機 ...

  2. 带你认识Xmanager

    XManager是一款小巧.便捷的浏览远端X窗口系统的工具.在工作中经常使用Xmanager来登录远端的Solaris系统,在X窗口系统上作图形化的操作.但是,Xmanager默认并不提供对于中文的支 ...

  3. mysql用命令创建用户创建数据库设置权限

     1.create database bbs; //创建数据库 2.create user bbs IDENTIFIED by 'bbs';  //创建用户bbs和登录密码bbs 3.grant AL ...

  4. MVC中路由的修改和浏览器的地址参数

    在 ASP.NET MVC 应用程序中,它是更常见的做法在作为路由数据 (像我们一样与身份证上面) 比将它们作为查询字符串传递的参数中传递. ) { return HttpUtility.HtmlEn ...

  5. 2648: SJY摆棋子

    2648: SJY摆棋子 https://www.lydsy.com/JudgeOnline/problem.php?id=2648 分析: k-d tree 模板题. 代码: #include< ...

  6. (1)分布式下的爬虫Scrapy应该如何做-安装

    关于Scrapy的安装,网上一搜一大把,一个一个的安装说实话是有点麻烦,那有没有一键安装的?答案显然是有的,下面就是给神器的介绍: 主页:http://conda.pydata.org/docs/ 下 ...

  7. Wireshark lua dissector 对TCP消息包合并分析

    应用程序发送的数据报都是流式的,IP不保证同一个一个应用数据包会被抓包后在同一个IP数据包中,因此对于使用自制dissector的时候需要考虑这种情况. Lua Dissector相关资料可以见:ht ...

  8. Linux-Shell脚本编程-学习-7-总结前面开启后面的学习

    国庆前期后国庆回来也都比较忙,把书一放下,在那起来,就难了,发现好多都开始忘记了,今天好不容易硬着头片看来两章,算是马马虎虎的把前面的基础性质的只是看完了吧. 后面讲开始学习Shell编程的高级阶段, ...

  9. Linux-Shell脚本编程-学习-5-Shell编程-使用结构化命令-if-then-else-elif

    if-then语句 if-then语句格式如下 if comman then command fi bash shell中的if语句可鞥会和我们接触的其他if语句的工作方式不同,bash shell的 ...

  10. CSP201312-1：出现次数最多的数

    引言:CSP(http://www.cspro.org/lead/application/ccf/login.jsp)是由中国计算机学会(CCF)发起的“计算机职业资格认证”考试,针对计算机软件开发. ...