Category Archives: Library

Traversing Descendants

jQuery provides methods to traverse downwards inside the DOM tree to find descendant(s) of a given element. These methods can be used to find a child, grandchild, great-grandchild, and so on for a given element inside the DOM. There are following three methods to traverse downwards inside the DOM tree: children() – returns all the direct… Read More »

Traversing Ancestors

jQuery provides methods to traverse upwards inside the DOM tree to find ancestor(s) of a given element. These methods can be used to find a parent, grandparent, great-grandparent, and so on for a given element inside the DOM. There are following three methods to traverse upward inside the DOM tree: parent() – returns the direct parent… Read More »

Traversing in jQuery

jQuery is a very powerful tool which provides a variety of DOM traversal methods to help us select elements in an HTML or XML document randomly as well as in sequential method. Elements in the DOM are organized into a tree-like data structure that can be traversed to navigate, locate the content within an HTML… Read More »

Callback Functions in jquery

A jQuery Callback Function is a function that will be executed only after the current effect gets completed. This tutorial will explain you what are jQuery Callback Functions and why to use them. Following is a simple syntax of any jQuery effect method: $(selector).effectName(speed, callback); If we go in a little more detail then a jQuery callback function will… Read More »

Chaining in jQuery

Before we discuss about jQuery Chaining of Methods, Consider a situation when you want to perform the following actions on an HTML element: 1 – Select a paragraph element. 2 – Change the color of the paragraph. 3 – Apply FadeOut efect on the paragraph. 4 – Apply FadeIn effect on the paragraph. Following is the jQuery… Read More »

Animation in jQuery

Let’s learn how to use jQuery animate() method to create custom animations on a web pages or any other jQuery (Javascript) Application. jQuery animate() Method The jQuery animate() method is used to create custom animations by changing the CSS numerical properties of a DOM element, for example, width, height, margin, padding, opacity, top, left, etc. Following is a simple… Read More »

Effects in jQuery

jQuery effects add an X factor to your website interactivity. jQuery provides a trivially simple interface for doing various kind of amazing effects like show, hide, fade-in, fade-out, slide-up, slide-down, toggle etc. jQuery methods allow us to quickly apply commonly used effects with a minimum configuration. This tutorial covers all the important jQuery methods to… Read More »

CSS Properties

jQuery provides css() method to manipulate CSS properties of the matched elements. JQuery css() method does not modify the content of the jQuery object but they are used to get and set CSS properties on DOM elements. jQuery – Get CSS Properties jQuery css() method can be used to get the value of a CSS property associated with the first matched… Read More »

Dimensions of jQuery

jQuery provides various methods to get and set the CSS dimensions for the various properties. Following diagram explains how various dimensions (width, height, innerWidth, innerHeight, outerWidth, outerHeight) can be depicted for any HTML element: jQuery Dimension Methods Following are the methods to manipulate CSS dimensions for the various properties of the HTML elements. width() – This… Read More »

CSS Classes in jQuery

jQuery provides three methods addClass(), removeClass() and toggleClass() to manipulate CSS classes of the elements. We have divided our CSS manipulation discussion into two parts. This chapter will discuss about manipulating CSS classes and the next chapter will discuss about manipulating CSS properties. jQuery – Adding CSS Classes jQuery provides addClass() method to add a CSS class to the matched HTML element(s).… Read More »