Animated button using Jquery

Last updated on January 22nd, 2016 at 03:41 am

Click to rate this tutorial!
[Total: 1 Average: 5]

Animated button using Jquery

This tutorial will help you in creating a animated submit button or similar using jquery.Here is the code.

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script language="JavaScript">
$(document).ready(function(){
$('#login_btn').click(function() {
startAnimation();
});
function startAnimation () {
			document.getElementById('login_btn').disabled = 'true';
            var b = [".", "..", "...", "....", ".....","......",".......","........",".........","..........","...........","............",".............",".", "..", "...", "....", ".....","......",".......","........",".........","..........","...........","............",".............",".", "..", "...", "....", ".....","......",".......","........",".........","..........","...........","............",".............",".", "..", "...", "....", ".....","......",".......","........",".........","..........","...........","............",".............",".", "..", "...", "....", ".....","......",".......","........",".........","..........","...........","............",".............",".", "..", "...", "....", ".....","......",".......","........",".........","..........","...........","............",".............",".", "..", "...", "....", ".....","......",".......","........",".........","..........","...........","............",".............","Backup Generated" ];
            var i = 0;		
            var a = setInterval(function () {
                $("#login_btn").val("Generating Backup " + b[i++]);               
            }, 500);
			window.location = 'migrate?start=yes';
        }

});</script>
<body>
<center>
<input type="button" id="login_btn" value="Generate Backup Now" onclick=""/><br />
Click to rate this tutorial!
[Total: 1 Average: 5]

Leave a Reply

Your email address will not be published.