Meow tỷ

             What to learn after jQuery Congratulations on learning jQuery! You've now learned the most popular JS library on the web today. Not only will you be able to code your websites with jQuery now, but you'll also have an easier time understanding code from other web developers and using any new JS library. More jQuery We certainly didn't cover all of jQuery here - there are more functions, and more options in the functions that we did cover. Check out the  documentation  for every function that you use, to make sure you know all the ways you can use it. You can also go through additional tutorials - many of them will probably overlap with what you learned here, but sometimes it helps to hear it from multiple places: jQuery Learning Center jQFundamentals jQuery plugins jQuery is a great library that does a lot, but it certainly doesn't do everything. Many web developers bring in additional libraries ...

       Review: DOM animation in jQuery jQuery provides a number of functions for animation and effects, which are listed in  its documentation . Changing visibility For simple visibility changes, you can use  hide()  and  show() : $("#pic").hide(); $("#pic").show();   (See example) You can also use  toggle() , which will decide whether to show or hide based on the current state:  $("#pic").toggle();   (See example) You can pass a duration into any of those functions, and jQuery will then animate the changing of the visibility:  $("#pic").toggle(1000); You can also use  slideDown() ,  slideUp()  and  slideToggle()  for sliding effects  (See example)  or  fadeIn() ,  fadeOut()  and  fadeToggle()  for fading effects  (See example) . You can pass a callback function as the second parameter to any of those functions, and jQuery will ca...

     Review: Processing forms with jQuery To process a form with jQuery, you should add an event listener to the form element for the 'submit' event: $("form").on("submit", function() { // process form }); If you are processing the form entirely in jQuery, then you should call  preventDefault()  to prevent the page reloading: $("form").on("submit", function(event) { event.preventDefault(); // process form }); When you want to know what a user filled out for an input in a form, you typically use  val() : var answer = $("#answer").val(); Inside the callback function, you can reference the form element using the  this  keyword. A common pattern is to call  find()  on the form element, to find only inputs inside the form element: $("form").on("submit", function() { // store the value of the input with name='age' var ag...

          Review: DOM events in jQuery Adding an event listener You can add an event listener using  on() : $("#save-button").on("click", function() { // handle click event }); If you need to access details about the event, you can find them in the  jQuery event object  that's passed into the callback function: $("#face-pic").on("click", function(event) { var mouseX = event.pageX; var mouseY = event.pageY; }); Triggering events You can manually trigger an event on an object from your JavaScript using trigger: $("#save-button").trigger("click"); That can be useful when testing new functionality, or when you want some code to run both when the page loads and after some particular event. Checking DOM readiness If you want to be sure that the browser does not run your JS code until the DOM is fully loaded and ready, then you can pass your code to  ...

       What DOM events and properties are                                     there? Browsers trigger many events. You can use jQuery to add event listeners for any of those events. A full list of browser events is on  MDN , but here are some of the most common event types and names, plus examples of using them: mouse events : 'click' ( example ), 'mousedown'/'mouseup' ( example ), 'mousemove' ( example ), 'mouseenter'/'mouseleave' ( example ) keyboard events : 'keydown', 'keypress', 'keyup' ( example ) touch events : 'touchdown', 'touchup', 'touchstart', ‘touchcancel’ ( example ) drag events : 'dragstart', 'dragend' (Many developers use jQueryUI for drag functionality, as it can be tricky to use the drag events directly. Here are examples of  draggable elements  and  drop zones .) form events : 'submit' ( example ), 'change' ( examp...