Article Categories
- All Categories
-
Data Structure
-
Networking
-
RDBMS
-
Operating System
-
Java
-
MS Excel
-
iOS
-
HTML
-
CSS
-
Android
-
Python
-
C Programming
-
C++
-
C#
-
MongoDB
-
MySQL
-
Javascript
-
PHP
-
Economics & Finance
jQuery Articles
Page 38 of 42
How to select all even/odd rows in a table using jQuery?
Working with tables is a very common task when it comes to developing web applications. And sometimes we may need to select a specific row from a table. Let’s say we want all the even or odd rows, but how to do that? In this article, we will see how to select all even/odd rows in a table with jQuery. Approaches to select all even/odd rows in the table To select all even rows in a table using jQuery, we have different approaches to achieve this task. Below we have discussed the three approaches that are commonly used in ...
Read MoreHow to create a pop-up div on mouse over and stay when click using jQuery
Overview The pop-up div can be created with the help of HTML, CSS and the functioning of which can be done with the help of ‘Javascript’ library ‘jQuery’. To make the mouseover and stay functionality to the div jQuery has a built in pre defined function. The two functions which are mainly used in this task are − mouseover − This function triggers when the mouse is over the selected element. mouseout − This function triggers when the mouse leaves the are of the selected element for mouse over. Algorithm Step 1 − Create a ...
Read MoreHow to create Home icon using jQuery Mobile
Overview The home icon can be created from the jQuery mobile icons library. This home icon is useful in the navbar area of a web page for navigation to the home page. So the home icon gives an attractive look to the navbar of the webpage. To create a home icon the jQuery mobile icons library has predefined classes which can be used to create a home icon. These classes can be defined in any element as class name and the home icon will be created for that particular element in which the classes are defined. Approach To ...
Read MoreHow to create Grid icon using jQuery Mobile
Overview The Grid icon in any web application can also be developed using jQuery Mobile, as the jQuery mobile icon library provides the benefit of many icons. So to create the jQuery Grid icon there are some pre-built classes by the jQuery icon library that can be used to create the grid icon. As we define the class name for any element in the bootstrap to create a component the same as it is we have to define the class in the HTML element which will create a grid icon. Approach To create a clickable grid icon button ...
Read MoreHow to add and remove input fields dynamically using jQuery with Bootstrap?
In proportion to the development of intricate and user-focused web applications, the capability to append and discard input fields dynamically has gained vital importance for developers. By amalgamating the influential abilities of jQuery and Bootstrap, developers can create responsive user interfaces that acknowledge user input instantly. The course of action for adding and removing input fields dynamically by means of jQuery and Bootstrap might seem daunting; however, with a profound comprehension of the inherent syntax and parameters, it can be executed with effortless ease. This paper delves into a step-by-step approach to adding and removing input fields dynamically with the ...
Read MoreHow to use API inside callbacks using jQuery DataTables plugin ?
In jQuery, the DataTables plugin allows us to add some extra features to the HTML table. When you create a table using the raw HTML, it looks unformatted. So, we need to style it using CSS. Also, we need to add some functionalities to the table, like pagination, searching into the table, and sorting in ascending and descending order according to a particular column's data. So, this all can take lots of effort from one developer. What if I say we add all functionalities using the DataTables plugin? Yes, you heard right. Here, we will look at the different examples ...
Read MoreHow to update mouse location when scrolling with jQuery?
In jQuery, we can trigger the ‘mousemove’ event to detect the mouse pointer's location on the web page. Also, we can detect the scroll using the ‘scroll’ event and subtract that value from the y position to get the relative mouse location. Using the ‘overflow-y: scroll’ CSS property, we can make any div scrollable. Syntax Users can follow the syntax below to get the relative mouse position while scrolling on the div. $('#main').scroll(function (event) { if (finalScroll != $('#main').scrollTop()) { location_y -= finalScroll; finalScroll = ...
Read MoreHow to show/hide div element depending multiple values using Bootstrap and jQuery?
Sometimes, we may require to show and hide div based on the selected values. For example, you want to show the registration or login forms based on the radio button's selected value. Below, we will learn to show/hide the div elements based on the selected value using JQuery. Show/hide the div Element Depending on the Selected Value From the Select Menu In JQuery, we can get the selected option’s value from the ‘select’ menu. After that, we can access the div element according to the selected option value and show them. Syntax Users can follow the syntax below to show/div ...
Read MoreHow to check the current selection against an expression using jQuery?
Overview jQuery is a fast, small, and feature-rich JavaScript library. It helps in DOM manipulation, event handling, animation, CSS and Ajax. To achieve the requirement we’ll use the “is(selector)” method of jQuery. is(selector) This method checks the currently selected elements against an expression/selector and returns true if any one of the selected elements matches with the selector. In the below code, we have created a container with the class “test”. We want to change the background color of the container when it is clicked. So, “test” which is the class name of the container will be used as a selector ...
Read MoreHow to count every element including the head and body in the document in jQuery?
Overview To count each and every element in the HTML document including the head tag and body tag can be achieved using the jQuery "length()" method. By selecting the universal selector ( * ) as selector and calculating the length of its using length property will return the number of the elements contained in the HTML document page. Syntax The syntax used to count the number of elements is − $(“*”).property; selector − The selector used in this is the universal selector, as the name itself describes that it selects each and every element of the page. ...
Read More