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
jQuery clone() Method
The clone() method is used to make clone of the elements that are matching to the selected elements and select the clones.
It basically makes copies of the selected DOM element to some other place in the DOM.
Syntax:
selector.clone()
...
How to integrate time zone in jquery calender
Hello Reader's If you are making the html 5 form then you can integrate the user time zone in the date time calender also, Lets see the example below:-
first you have to downoad the JS an CSS file from here
Now you have to create an html pa...
DOM Element Replacement in jquery
If you want to replace html element with some other element, the jquery replaceWith method can be used.
You can replace some specified DOM element with the other html or DOM element. The replaceWith() method is used in this case.
Syntax:
...
Slidebar Menu plugin in Jquery
We can create a slidebar menu using jquery slidebar plugin. It is a jQuery plugin that gives a slidebar menu for easily implementing in the web pages.
We have to include slidebars.js in our source files.
Here is an example that shows how to...
Accordion Menu using jQuery
Accordion Menu are like the dropdown menu with some effects of animation. It has some top menu and dropdown list inside that menu and some other top menu and another dropdown list inside this menu.
When we click on the first top menu the dropd...
jQuery :not() selector
JQuerys :not() selector is used to filter in some cases when we have some selectors. It selects all the elements except the elements that matches the selector.
for example, If we have some checkboxes. When we select any checkbox the backgroun...
How does caching helps and how to use caching in jQuery?
Hello Readers,
In jquery when we use the two or more than two same id's as a selector or elements and operate over jquery event than sometimes effect on its performance due to caching.
For Example :
$("#mydemo").css("color", "red");
//...
jquery function after() and before()
Hello Readers,
We can use .after() and .before() methods for different tasks.
If we want to add any other HTML tag or content after or before define HTML tag, then we can use these jquery methods for the same tasks.
Example: meth...
Add CSS in html tag using jQuery
Hello Readers,
Probably, we need to add css property in HTML tag using jQuery.
Here I am describing different kinds of syntax to adding style property using jQuery
1.) If you want to add single css property using jquery, then you...
What is chaining in jQuery?
Hello Readers,
In jquery chaining is the technique and most poweful feature. It means we chain the one or more methods or events to one selectors or elemnts.
Because of this it short the code level as well as its performance (means it gives...
jQuery add() Method
Hello Readers,
We use add() method to add elements with a existing group of elements or selectors.
Syntax: selector.add(selector)
Parameters
Please find the following description of all the parameters used by this add met...
How to pass a variable in jQuery from PHP
Hello Reader's! If you want to send variables from PHP to jQuery then you have to use the selectors:-
Lets's see the example below:-
This you have to put in the bottom of php page with the selector is "input[type=checkbox]"
$("input[typ...
custom side bar with the help of jquery
Hello Readers
In this article I will guide you how to create custom side bar with the help of jquery.
Here is the HTML
<section id="slideBox" class="open">
<nav id="menu">
<ul>
...
Jquery callback function
Hello Readers,
In jQuery, It is a function which is passed as an argument to another function and it is executed when/after it's parent function has been completed.
Callbacks are some special jQuery function because it patiently wa...
Difference between $document.ready() and $window.load() in jQuery
Hello Readers,
Usually, we use the jQuery in our web project as per the requirement. We start the jQuery syntax as $(document).ready() OR $(window).load() function.
Here I will describe the difference between $(document).ready() and $(w...
How to redirect html page using jQuery ?
Welcome to findnerd, today we are going to discuss How to redirect html page using jQuery ?
In this blog you can see How to redirect html page ?
You can simply use the JavaScript "window.location" property to make a page redirect.
you c...
How to pass variables and data from PHP to JavaScript ?
Welcome to findnerd, today we are going to discuss How to pass variables and data from PHP to JavaScript.
In this blog we demonstrate and describe passing PHP variables containing simple data types to JavaScript.
There are actually several ap...
How to use fadeToggle() Method in jQuery ?
Welcome to FindNerd
Today we are going to discuss fadeToggle() method in jQuery.
Firstly let know what use of fadeToggle() Method ?
In fadeToggle() Method if the elements are faded out, fadeToggle() will fade them in and if the elements...
How to use Callback Function in jQuery ?
Welcome to FindNerd,
Today we are going to discuss on Callback Function in jQuery.
Firstly let know what is the use of Callback Function ?
This function is executed after the current effect is finished.
In simple way we can say that cal...
How to use stop() method in jQuery ?
Welcome to findnerd, today we are going to discuss on stop() method in jQuery.
Firstly let know what is the use of stop() method ?
So basicaly stop() method is used for stoping animations or effects before it is finished.
syntex of stop(...
How to use slideToggle() Method in jQuery ?
Welcome to findnerd, today we are going to discuss on slideToggle() method in jQuery.
Firstly let know what use of slideToggle() method ?
The jQuery slideToggle() method toggles between the slideDown() and slideUp() methods.
syntex of sl...
How to use prepend() method in jQuery ?
Welcome to findnerd, today we are going to discuss on prepend() method in jQuery.
Firstly let know what use of prepend() method ?
prepend() method is used for inserting at the beginning of the selected elements in jQuery
you can see b...
How to use animate() method in jQuery ?
Welcome to findnerd, today we are going to discuss on prepend() method in jQuery.
Firstlt let know what use of prepend() method
So, basically animate() method is used to creating custom animations.
Syntex of animate() method
$(selector)...
How to use append() method in jQuery ?
Welcome to findnerd, today we are going to discuss on append() method in jQuery.
Firstly let know what use of append() method
Append() method is used for inserting at the end of the selected elements in jQuery
you can see bellow example h...
How to use toggle() method in jQuery ?
Welcome to findnerd, today we are going to discuss on toggle() method in jQuery.
Firstly let know what use of toggle() method
In the toggle() method, you can toggle between the hide() and show() methods in jQuery.
So we can say that toggle()...
How to use hide() and show() methods in jQuery ?
Welcome to findnerd
Today we are going to discuss hide() method and show() method in jQuery
firstly, let start hide() method
hide() method is used for hiding data with HTML elements
Syntex of hide()
$(selector).hide();
And now abou...
How to add and remove a class on click event
hii,
Today i am sharing a blog on How to add and remove a class on click event in javascript.
First of all you need to either download few plugins or just copy and paste the below link inside head tag.
<script src="https://ajax.google...
Check the broken image link and replace it with alt text in jQuery
Check if image link is broken in page and replace it with the alt text and open the blank page when user click on it
$('img').each(function( ) {
$( this ).error(function(){
var img_path = $(this).attr...
What is a CDN in jquery?
Hello Readers,
CDN is a content delivery network or we also call it as content distribution network, its basically a large distributed system of servers which deployed in multiple data centers across the internet.
Goal of CDN:
Serve co...
jQuery.noConflict in jquery
Hello Readers,
jquery.noConflict is the jquery function (jquery is the client side library) when we use the jquery.noConflict function in jquery it removes the conflict between different jquery libraries like Mootools, Prototype etc. they also...
How to upload image using simle Jquery and HTML5
Hello Reader's!
If you are developing the html5 based ajax image uploader then you can look this jquery as the best and easy to use. Lets see how to upload images
1) include two JS file
<script src="jslibs/jquery.js" type="text/javascri...
How to use password strength indicator on slider?
In this example, we used a variable named score to calculate the strength of password. If password contain 6 chars the score increases with 10 points, if it has at least one digit 10 points, has
at least one ASCII symbol (!@#$%^&*) 10, mix...
Draggable and resizable a block using HTML5 and Javascript
If you want your block draggable and resizable, the following code will help you for the same:
HTML:
<section class="map">
<div class="container-fluid">
<div class="this-week panel-group dayListing" id="ac...
How to create a basic plugin using jquery
If you want to make a functionality that can be used anywhere in the code. For example, you want some method that can be called on the jquery selection and it can perform number of operations on the selection. For this, you can write a plugin.
...
How to make HTML by using the Json Array
Hello Reader's
If you having the data coming from the Json array and you need it to show in html table. Then you can perform the short Jquery action for making it automated restful service.
Here the code of javascript
var _table_ = docum...
Difference among bind(), live(), delegate(), on() methods in jQuery
Hello,
Most of the time we have a bit of confusion between the jQuery .bind(), .live(), .delegate(), and .on() methods and when they should be used. Here I am sharing some information regarding this:
bind() Method:
Syntax: .bind( eventTyp...
Display image before upload using javascript/jQuery
This post demonstrates how to display an image prior to uploading it on server.
This demo uses the JavaScript's readAsDataURL method of reader API which will read image as url.
<html>
<head>
<script src="https://a...
How to load header and footer using Javascript
Hello Reader's. If you have developed the header and footer of the website separatly then it's very easy to make them render on a webpage. By using the JS you can call them with a single line of code as written below:-
<html>
<head&g...
Finding mouse cordinate by JQuery
By using jquery event.pageX and event.pageY we find the coordinate of mouse. The PageX event shows the edges from left and the PageY event shows the edges from top.
<!doctype html>
<html lang="en">
<head>
<meta cha...
How to upload multiple files using Jquery
Hello Reader's!. Now multiple files on a single getting in fashion so you can use any of the multiple upload library code, But here we'll see how to use Jquery and PHP to do the same
For getting it start we need a html form page and it'll go ...
Display image preview before upload using jQuery
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
</head>
<body>
<img id="thumbnail" src="test.png" alt="Image"/>
...
How to make a redirect html page using jQuery
Redirecting a web page will occur in the header part of the page.
In JQuery the page redirect have a code and it will go like this below
// similar behavior as clicking on a link
window.location.href = "http://findnerd.com";
As soon thi...
Reset or Retrieve value of all hidden type input box of FORM or DIV using jquery
Reset or Retrieve value of all hidden type input box of FORM or DIV using jQuery .each() method. You can use below code for this
<!DOCTYPE html>
<html>
<head>
<title>Reset or Retrieve value of all hidden ...
How to detect and validate credit card numbers in jQuery
If you want to detect and validate credit card numbers in jquery you can use the below code.
In this we use client side validation to verify the credit card type or user using valid card number.
It will display the type of detected credit c...
Custom events in jquery
When we think about the jquery then first thing comes in mind that is events so today we are going to discuss the custom events. Do you know about custom events? Its name has cleared the concept, means your own events. There are so many benefits ...
Basic Tutorial of Jquery Effects Method
About JQuery
jQuery is a cross-platform JavaScript library designed to simplify the client-side scripting of HTML.
jQuery's syntax is de...
Jquery return false vs preventDefault
Today we are going to discuss the diffence between return false and preventDefault. We mostly use these scripts but don't know their working so let's go we first discuss the preventDefault.
A) PreventDefault: it is helpful to stop the default ...
Jquery Return false, event.preventdefault and event.stopPropagation
Return False :-
Basically returning false is a way to tell your action (like button click event, submit and load etc. ) is not firing. Return false do the three basic things
event.preventDefault();
event.stopPropagation();
Stops the call...
How to Dynamically add element in DropDownList?
I have created a dropdownlist with the help of Jquery and javascript. In this, when we will enter the text in the field given, that value will be stored and will be added to the next list dynamically. Also We can easily remove all the items by ju...
How to use Animated AJAX Record deletion in jQuery?
With the help of jQuery we can delete link for any record. On below code we have add a click event to triggers the ajax request. when the ajax request returns get success response.
$(document).ready(function() {
$('a.delete').click(fu...