-
HTML5 Quickstart Template – Mobile Viewport, CSS3, Google Font, Latest jQuery – All Ready
Whenever I want to quickly make a webpage, I don’t want to have to build the whole page everytime. Here is my starter code for an HTML5 page. The key points are : HTML5 Doctype – Ready Viewport and Mobile – Ready Title tags, Character Set, Keyword and Description Meta, Favicon, Stylesheet tags – Ready…
-
Reset your form after submit using jQuery
After you submit a form, you reset it with the following code: $(“form#myform”)[0].reset(); For example on my Magic8Ball website, I created a function to submit the form and reset it immediately, clearing out the input elements. var formData = $(“#form”).serializeArray(); $.ajax({ url : “speaktome.php”, type: “POST”, data : formData, success: function(result) { $(“.youranswer”).hide().html(” + result…
-
Change your cursor to waiting or in-progress with jQuery.
Found this great bit of code on SO. Basically, it changes your cursor to the progress or wait symbol whenever AJAX is started on your page. Nice for forms or submissions by the user. $(‘body’).ajaxStart(function() { $(this).css({‘cursor’:’wait’}) }).ajaxStop(function() { $(this).css({‘cursor’:’default’}) }); By the way here is a great page from w3schools on cursor types!
-
Ultra-easy image rollover solution with jQuery (no plug-ins needed)
Found a fantastic image rollover solution on StackOverflow recently, with this little piece of jQuery and no other plug-ins needed your rollovers works easily and seamlessly… HTML <img data-other-src=”big-zebra.jpg” src=”small-cat.jpg”> <img data-other-src=”huge-elephant.jpg” src=”white-mouse.jpg”> <img data-other-src=”friendly-bear.jpg” src=”penguin.jpg”> Javascript $(‘img’).on(‘mouseenter mouseleave’, function() { $(this).attr({ src: $(this).attr(‘data-other-src’), ‘data-other-src’: $(this).attr(‘src’) }) });