<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="utf-8">
<script src="http://code.jquery.com/jquery-1.11.1.js" type="text/javascript"></script>
<script>
var contador=0;
$(document).ready(function(){
$("input[type=button]").click(function(){
if($("input[name=test]").val()=="")
{
contador=0;
moveA();
}
});
});
function moveA()
{
$("input[name=test]").removeClass("moveC").addClass("moveA");
setTimeout("moveB()",50);
}
function moveB()
{
$("input[name=test]").removeClass("moveA").addClass("moveB");
if(contador++<5)
setTimeout("moveC()",50);
}
function moveC()
{
$("input[name=test]").removeClass("moveB").addClass("moveC");
setTimeout("moveA()",50);
}
</script>
<style>
input[type=text] {position:relative;}
.moveA {
left:-2px;
}
.moveB {
left:0px;
}
.moveC {
left:2px;
}
</style>
</head>
<body>
<form>
<input type="text" name="test">
<br><input type="button" value="test">
</form>
</body>
</html>