Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to display loading spinner in a textbox on clicking of a button?

How to display loading spinner in a textbox on clicking of a button? Say I have a username and password textbox, and a login button. Once i enter username and password and clicking on Login button, the spinners should be displayed in the textboxes. Kindly help. Iam looking for a JQuery option or Javascript.

like image 580
Bino Avatar asked Oct 11 '12 10:10

Bino


1 Answers

Let's say your html has following textbox :

<input id='inputsource' />

Define a new css class

.loadinggif 
{
   background:
     url('http://www.hsi.com.hk/HSI-Net/pages/images/en/share/ajax-loader.gif')
     no-repeat
     right center;
}

and then adding this class to your testbox by jquery code:

$('#inputsource').addClass('loadinggif');

Jsfiddle: http://jsfiddle.net/msjaiswal/FAVN5/

like image 122
Mayank Jaiswal Avatar answered Oct 21 '22 18:10

Mayank Jaiswal