Submit Button Enabling
"Enabling" you ask? Yes. We all know how to disable the submit upon form submission and the reasons for doing so, but what about re-enabling the submit button after an allotted amount of time. After all, what if the user presses the "stop" button immediately after submitting the form? They'd be screwed. Why not re-enable the submit button after an allotted amount of time so that the user may re-submit?
The MooTools JavaScript
window.addEvent('domready',function() {
var subber = $('submit');
subber.addEvent('click',function() {
subber.set('value','Submitting...').disabled = true;
(function() { subber.disabled = false; subber.set('value','Resubmit'); }).delay(10000); // how much time? 10 seconds
});
});
Of course, this isn't ideal in all situations. It is, however, a nice touch if your system can accommodate for it.
Update: Upon submission, the button's message changes to "submitting..." and once enabled, the message changes to "Resubmit." Thank you to Facundo Corradini for the suggestion!
![CSS 3D Folding Animation]()
Google Plus provides loads of inspiration for front-end developers, especially when it comes to the CSS and JavaScript wonders they create. Last year I duplicated their incredible PhotoStack effect with both MooTools and pure CSS; this time I'm going to duplicate...
![Creating Scrolling Parallax Effects with CSS]()
Introduction
For quite a long time now websites with the so called "parallax" effect have been really popular.
In case you have not heard of this effect, it basically includes different layers of images that are moving in different directions or with different speed. This leads to a...
![The Simple Intro to SVG Animation]()
This article serves as a first step toward mastering SVG element animation. Included within are links to key resources for diving deeper, so bookmark this page and refer back to it throughout your journey toward SVG mastery.
An SVG element is a special type of DOM element...
![WebSocket and Socket.IO]()
My favorite web technology is quickly becoming the WebSocket API. WebSocket provides a welcomed alternative to the AJAX technologies we've been making use of over the past few years. This new API provides a method to push messages from client to server efficiently...