In this lesson, you will learn how to animate a web element using .animate() jQuery function. Introduction to Animation in jQuery They syntax of .animate() function has two variants. .syntax ( {json object of properties} [, duration] [, easing function] [, callback function ]) Or .syntax ( {json object of properties }, options ) The... » read more
In this lesson, you will learn how to display a hidden web element or hide an already visible element using jQuery sliding up or down effects. This kind of animation can be achieved using .slideUp() and .slideDown() functions, as we have learned in the previous lesson. But to minimize the code, the right method is... » read more
In this lesson, you will learn how to hide the selected element on the web page by sliding it in the up direction. Introduction The syntax of .slideUp() function is: .slideUp( [duration] [easing function ] [call back function]) The slideUp() function animates the height of a selected element, which seems like hiding the element by... » read more
In this lesson, you will learn how to hide a selected element by fading it to transparent or show already hidden element by fading out it to opaque. Introduction The syntax for fadeToggle() function in jQuery is: fadeToggle([duration] [,easing function name] [, callback function ]) If you skip these parameters, .fadeToggle() function will use the... » read more
In this lesson, you will learn how to hide the selected element on the web page by fading it to transparent. Introduction The syntax for fadeout() function in jQuery is: fadeOut([duration] [,easing function name] [, callback function ]) All of these three parameters are optional. The .fadeOut() function hides the selected element by animating its... » read more
In this lesson, you will learn how to show an invisible element by fading it to opaque. Introduction The signature of .fadeIn() function has three parameters. fadeIn( [duration] [, easing] [, call back function] ) With .fadeIn() function, you can animate the opacity of the selected element. However, it won’t let you specify the final... » read more
In this lesson, you will learn how to show an invisible element or hide a visible element on a web page using jQuery. Introduction The signature of toggle() function is similar to the signature of the show() or hide() function of the jQuery. toggle( duration [, easing function ] [, complete]) With no parameter, the... » read more
In this lesson, you will learn how to show an invisible element on a web page using jQuery. Introduction The signature of the show() function is similar to the hide() function of the jQuery. show( duration [, easing function ] [, complete]) Duration could be a string( slow, normal, fast) or number( representation of time... » read more
In this lesson, you will learn how to hide an element on a web page using jQuery. Introduction The signature of the hide() function is: hide( [duration [, easing] [, call back function ]] ) All of these parameters are optional. Duration could be a string (slow, normal, fast) or a number(a representation of time in... » read more
In this lesson, you will learn about the basics of jQuery effects; how to select elements, and how to apply effects, like showing or hiding an element. These are jQuery’s built-in effects and animation functions. Making elements appear and disappear is a common JavaScript functionality which is helpful to create features like drop-down navigation menus,... » read more
In this lesson, we will learn the different ways jQuery can interact with HTML elements, such as changing their CSS properties and attributes. CSS and jQuery interaction jQuery’s provides a css() function which allows you to change CSS property of any element on your page. You can change multiple properties at once as well, thanks... » read more
In this lesson, you will learn how to manipulate content and elements on a web page from simply replacing HTML element to completing removing tags and content from the web page. How do you manipulate content on a page using jQuery? Below are the most used jQuery functions that let you manipulate the content on... » read more
In this lesson, you will learn about a chaining concept in jQuery. This is undoubtedly the most powerful feature of jQuery which enables developers to write multiple lines of code in a single link. It connects multiples function, events on the element being selected. What is chaining in jquery? jQuery was created with one aim... » read more
In this lesson, you will learn about a compelling technique for selecting and interacting with web page elements – using CSS selectors. That means, if you are familiar with Cascading Style Sheets and know how to select a particular element to style it, you are on your half-way to learning jQuery. Basic Selectors A CSS... » read more
In this lesson, you will learn briefly about the Document Object model – the data representation of the web elements that comprise the page. We will look at what is DOM and how programming languages interact with the DOM to select elements to create animation and effects. What is DOM? When a web page is... » read more