Buttons with built-in loading indicators

Post by ultimatedelman » Thu, Jun 06, 2013, 4:15 PM UTC

RyanMcGreal wrote: post #61

ultimatedelman wrote: post #52

This is very pretty, but there's no need for a larger, separate JS file. All of this can be handled with CSS and a simple JS command that adds/removes a CSS class on click. Quick demo: http://codepen.io/ultimatedelman/pen/klDHy Since you wouldn't obviously use all the effects in this article, just pick the one you would use and have the .loading class effect the correct change. UPDATE: now with fewer elements. Only H…

The other nice touch in Ladda is that it disables the form button on activation. Again, given your demo, not hard to replicate with a `this.disabled=true` statement.

Post by simonobo » Fri, Jun 14, 2013, 1:47 PM UTC

ultimatedelman wrote: post #62

RyanMcGreal wrote: post #61

Earlier quoted context omitted.

The other nice touch in Ladda is that it disables the form button on activation. Again, given your demo, not hard to replicate with a `this.disabled=true` statement.

You can also do this with CSS: pointer-events: none; cursor: not-allowed;