Featured
-
Top 10 Template Engines for JavaScript
What is a Template engine? Template Engines are
by nishant.mishra -
jQuery Accordion
Hello readers! In this Blog we will gain knowled
by vishwanath.rana -
How to make Numbered and bulleted list in HTML Editor with JavaScript
Hello all, Working with HTML Editor we wanted t
by gaurav.gautam -
How to hide particular div with just one click?
Hi, you want a condition in which the particula
by abhishek.tiwari.458 -
How to Create and Retrieve Array in Javascript?
If you want to store multiple values in a single v
by siddharth.shahi
Tags
How to remove all child nodes from the selected elements?
If you want to remove all the child nodes which contain selected HTML elements then it's not a difficult task now, we can do this easily with the help of jQuery empty() method.
All the child nodes of our selected HTML element will be remov...
Chapter 4: jQuery Events
Hello Readrs,
We will learn about JQuery event in below.
JQuery event provide you a facility to user interaction with a web page it means that you can code that runs when a user click(s) on a certain part of the page or an element(s).
...
Bind() method in jQuery
Bind() method:
Bind method is used to attach events to selected elements and also used to specify a function when the event occurs.
Syntax:
$(selector).bind(event,data,function,map)
Example:
<!DOCTYPE html>
<html>
...
keypress, keydown, keyup events in jQuery
Hello readers,
Today we will discuss about keypress, keydown, keyup events in jQuery. These events fires when user pressed any key.
Lets have a look all three events:
keypress: This is a special event and works when any key ...
How to remove html element with the help of jQuery
It is very easy to remove html elements, we can do this with the help of jQuery . jQuery have two method for doing this one is jQuery remove() method and the other one is jQuery empty() method. Below i am explaining jQuery remove() meth...
Learn how to create a slider with animation effects using simple code of jQuery
Hii,
I had shared few example of animation effects using CSS and jQuery,This blog is continuation with my previous blogs on "animation effects" using CSS and jQuery
Learn how to create a slider in html with different animation eff...
How to add content at the beginning of the selected element
If we want to add some content at the beginning of our selected html element then we can acquire it by simply using jQuery prepend() method.
The jQuery prepend() method appends the content at the begining of the element which we have been...
SlideToggle using JQuery
Hello Readers
The slide Toggles (slideToggle()) method is use toggle between slideUp() and slideDown() for the selected elements like(div, paragraph, etc..).
This blog post will help you with displaying the navigation menu items in a ...
Attribute selector in jQuery
Attribute selector:
We usually use either Class or ID to find html elements in jQuery but we can also use attribute to find specific elements. Attribute selector is written inside square brackets [attribute].
Some of the common ...
Adding two columns value using jQuery
We can add the values of two columns and show the result in another column using jQuery easily.
Html code:
<div id="main">
<table>
<tbody>
<tr>
<th>Digit1</th>
<th>Operator</...
Add new content using jQuery append() method
The jQuery append() method is very useful if we want to append some content to our web page by clicking on a particular button, div or any html element .
The jQuery append() method appends the content at the end of the element whi...
How to chain multiple methods in single statement
If we want to run different methods with in single statement than we can achieve it by using jQuery chaining property . With the help of jQuery chaining property we can chain different methods with each other.
JQuery chaining property allows u...
Start an infinite animation effect on page load using jQuery
Hii,
When we talk about adding animation effect in our web page then css is one the best option we use along with any of the programming laungage such as javascript,jQuery etc to give dynamic animation effects.
Using animation effect in a...
Sorting list with jQuery
Sorting as we all know refers to the rearrangement of data in some predefined format, it can either be ascending or descending or alphabetically or numerically. This is a small blog on sorting the list data using jquery. Here is a sample co...
How to check password strength in your form using jQuery
Hii,
In this blog, I am sharing jQuery code by which you can set validation i.e check password strength in your form. By adding this option in your form, You can enhance the security level of form by adding validation for the password.
...
Manipulating CSS using jQuery addClass() Method
If we want to manipulate css or we want to add some classes to our tags when page load or when we click on the button , we can achieve it by using jQuery addclass() method .
addClass() method add particular classes to the...
Create draggable objects using javascript
Hii,
In this blog i am sharing a simple javascript code for creating draggable objects using mouse event.
This code can be used when you want to add animation effect in your static html document and make it more attractive.
You ca...
Chapter 2: Basics of jQuery
Hi All, In this chapter we are learn some basics, So here we go
A jQuery statement starts with the dollar sign ($) and ends with a semicolon (;) in the which is in document ready function. $ sign defines the jQuery,
Document Ready -
Al...
Loading simple data with the help of ajax
If we want some part of our website to load but we dont want other part to be loaded for this purpose ajax is used . Ajax stands for Asynchronous JavaScript and XML it helps us to load particular part of the page but not the whole ...
Chapter 1: An Introduction to jQuery
What is jQuery ?
jQuery is a fast JavaScript library with less code which was created by John Resig in 2006. jQuery is very fast and this feature make it one of the most popular language.
It is the most popular browser friendly javascript lib...
What is JQuery noConflict method?
As jQuery do most of the JavaScript libraries use $ as a function or variable name. In jQuery's case, all functionality is available without using $ because it is just an alias for jQuery. In jQuery we can return control of $ back to the othe...
jQuery not() Method
In jQuery not() method, we set a criteria. Elements that match the criteria are expelled from the selection, and those do not match will be returned.
Below is the syntax of jquery filter method:-
selector....
Filtering methods in jquery
In jQuery there are three most essential filtering techniques used these are first(), last() and eq(), which permit you to choose a particular element in respect of its position when there are more than one element or have group of elements....
Highlighting important information with the help of jquery
Many time we want to show some information in our page to be highlighted, we want some important information to be display with different background color. we can acquire this by simply using jquery filter() method.
In jquery filter method &nb...
Interaction in jQuery with Drag-able
The Drag-able function can be used in JqueryUI to enable draggable functionality on a DOM element. Using Drag-able function we can drag the element by clicking on it with the mouse.
Example code:
<html>
<head>
<...
What is the difference between JavaScript and JQuery?
Hii all, it seems that many want to know what is actually a difference between JavaScript and JQuery. So, here are following differences between these two :-
JavaScript :-
1. JavaScript is a scripting language.
2. In JavaScript, you...
Chaining in jQuery
Chaining is a technique that allows us to run multiple jQuery commands, one after the other, on the same element. Using chaining we can run multiple jquery methods within a single statement.
Chaining makes code short and easy to manage and it im...
jquery autocomplete in AngularJs not working on first click
Hi,
I was using jquery autocomplete functionality in angularJs using directive. Whenever I tried to load static data it was working fine, but when I loaded data from server side the first click was not working.
I was using code someth...
How to change the font family using JQuery?
In this blog, we will see how we can change the font family of text through jQuery. In this blog we have two div in the left div we show the text and in the right section, we make a selectbox( ) from which we select the particular font whatever y...
Creating Marquee using jquery
Marquee is a text which is seen floating from right to left or left to right , top to bottom or bottom to top depending on the code . Before we can created marquee effect by simply using <marquee> tag of html as this html tag is not support...
Difference between size() and length in Javascript
In jQuery size() and length property are the two features, which have the same property of returning the number of elements in a jQuery object which creates a lot of confusion for developers.
This blog is to help developers to understand the d...
Simple Calculator using Html and jQuery
Simple Calculator using Html and jQuery:
We can create a basic calculator using Html, Css and jQuery. When user will click digits then it will store in either crntStore or btnVal variable. When user will click a arithmetic operation button the...
Changing font-size using jquery
In this tutorial I am going to explain how to change the font size of text content in a paragraph dynamically using jquery. We can change the font-size using jQuery css() function.When page will load font-size will be 14px .When us...
Sbiling in jquery with demo
It returns all the sibling elements of the element that you have selected.
It allows you to go through the siblings of the matched elements in the DOM tree and creates a new jQuery object from the matching elements.
Lets see how it works:
...
Difference between window.onload and document ready
There are some minor difference between the two but it can effect with lots of confusion between to many of us.
window.load - It is fired when everything on the page is loaded. By everything I mean that when the DOM is loaded, when all t...
Queue Functionality In jQuery animate()
If we want to create custom animation than for this purpose jquery animation is used.
jquery animation method syntax is below:-
Syntax :-
$(part to be selected).animate({parameters},speed,callback);
Queue functionality of ...
How to use jQuery :first Selector?
Hi Reader's,
Welcome to FindNerd, today we are going to discuss how to use jQuery :first Selector?
Basically :first selector is used for selecting the first element and it is always use in a group.
The :first selector&n...
How to use load() method in jquery?
Hi Reader's,
Welcome to FindNerd, today we are going to discuss how to use load() in jquery?
Basically load() method is used for loading data from server and putting return data into selected item,in simple word we can say tha...
How to increase and decrease the date by one on click using js?
If the user wants to increase or decrease the date by one, on click of a button, he can easily do this by using the following code.
HTML:
Date: <input type="text" class="dateone" id="datepicker">
<input type="button" onclic...
Slide Element from Left to Right Position
Hello readers,
This is a quite simple blog that will show how to slide a div from left to right using jquery function. Here I have taken two div one is outer that have some property like it is set to at left position and add the background col...
How to disable previous dates in datepicker using jQuery?
Hi Readers,
Welcome to FindNerd, today we are going to discuss a method to disable previous dates in datepicker using jQuery?
Datepickers is a very important feature of a web application. It is mostly used in any registration form when ...
Disable the control(ctrl key) plus click event for a particular click with demo
There are many cases where we do not want our page to open in another tab while clicking ctrl+click and the anchor tag is producing dynamically.
For that, we can add the following script which will disable the same effect.
$(funct...
jQuery fadeToggle Method
In many sites we have seen that when we click on some button it will make some div faded, this will happen with the help of fadeOut() method in jquery.
If we want some faded div or hidden div to get show, we can do that by using fadeIn()...
append( ) property
append( ) property is used to insert a block of elements inside a particular element. It helps in adding block of element during runtime.This property insert's content, specified by the parameter, to the end of each element in the set o...
Transition of a div on click event using Jquery with demo
Hello friends,
If you want to make an animation like transition on your multiple views or If you want to slide your view i.e. your DIV element from one to another, you can use the following code.
In this we have all the content in...
How to rotate a text
As we see in many website some text get rotated and other text come in its place this is known as text rotation. It is a very basic thought where we can display more than one word without taking much space by simply rotating an individual w...
How to use focus() Method Jquery ?
Hi Reader's,
Welcome to FindNerd, today we are going to discuss how to use focus() Method in Jquery.
Basically focus() Method event when an element gets focus with selected by mouse to it.
So we can say that ...
How to use event.data property in jQuery ?
Hi Reader's,
Welcome to FindNerd, in this blog I will guide you to use event.data Property in Jquery.
Basically event.data property is used when the current executing handler is bound. so we can say that it is an optional obje...
How to use appendTo()event in Jquery ?
Hi Reader's,
Welcome to FindNerd, today we are going to discuss how to use appendTo()event in Jquery.
Basically appendto() method is used for inserting specified content of HTML elements at the end of the selected elements.
&nbs...
How to use blur() Method in Jquery ?
Hi Reader's,
Welcome to FindNerd, today we are going to discuss how to use blur() Method in Jquery.
The blur() Method occurs when an element loses focus hence we can say that blur() method is used for attaching a function to ...
