<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script type="text/javascript">function shake(id) {
var style = document.getElementById(id).style,
p = [4, 8, 4, 0, -4, -8, -4, 0],
fx = function() {
style.marginLeft = p.shift() + 'px';
if (p.length <= 0) {
style.marginLeft = 0;
clearInterval(timerId);
};
};
p = p.concat(p.concat(p));
timerId = setInterval(fx, 13);
}
window.onload = function() {
shake("txtUserName");
};</script>
</head>
<body>
<input type="text" id="txtUserName" value="www.skyfinder.cc" />
<div>
<input type="button" id="btnStartShake" value="抖动" onclick='shake("txtUserName");' /></div>
</body>
</html>
转载请注明:清风亦平凡 » Javascript简单实现HTML元素抖动效果