- Trending Categories
- Data Structure
- Networking
- RDBMS
- Operating System
- Java
- MS Excel
- iOS
- HTML
- CSS
- Android
- Python
- C Programming
- C++
- C#
- MongoDB
- MySQL
- Javascript
- PHP
- Physics
- Chemistry
- Biology
- Mathematics
- English
- Economics
- Psychology
- Social Studies
- Fashion Studies
- Legal Studies
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
Found 766 Articles for JQuery
283 Views
The show() method in jQuery is used to display the hidden element.SyntaxThe syntax is as follows −$(selector).show(speed, easing, callback)Above, the parameter speed is the speed of the show effect, whereas easing is the speed of the element in different points of the animation. The callback function is a function that executes after the show() method completes.Let us now see an example to implement the jQuery show() method −Example Live Demo $(document).ready(function(){ $(".btnhide").click(function(){ $("p").hide(); }); $(".btnshow").click(function(){ $("p").show(); }); ... Read More
352 Views
The ready() method in jQuery occurs when DOM has been loaded.SyntaxThe syntax is as follows −$(document).ready(func)Above, func specifies the function to run after the document is loaded.ExampleLet us now see an example to implement the jQuery ready() method − Live Demo div { width:600px; } .demo * { display: block; background-color; border: 2px solid yellow; color: blue; padding: 10px; margin: 10px; } $(document).ready(function(){ $("li.test").siblings().css({"background-color": "orange", "color": "white", "border": "3px dashed blue"}); }); Demo Heading ul (parent) previous sibling previous sibling ... Read More
104 Views
The element ~ siblings selector in jQuery is used to select all elements that are siblings of the specified "element".SyntaxThe syntax is as follows −("ele ~ siblings")Above, the parameter ele is any valid selector, whereas siblings are the siblings of the ele parameter.ExampleLet us now see an example to implement the jQuery element ~ siblings selector − Live Demo $(document).ready(function(){ $("div ~ p").css("color", "orange"); }); div { border:1px solid black; padding:10px; } Demo Heading This is demo text. span outside p element This is demo text. ... Read More
173 Views
The not() method in jQuery is used to return elements that do not match specific criteria.SyntaxThe syntax is as follows −$(selector).not(criteria, func(index))Above, criteria are a selector expression, whereas func is the function to run for each element in the group.ExampleLet us now see an example to implement the jQuery not() method − Live Demo $(document).ready(function(){ $("button").click(function(){ $("h2").not(".demo").css("color", "orange"); }); }); h2 { color: blue; } Student Info This is a demo text. Exam Info This is a demo text. Teacher's ... Read More
177 Views
The parentsUntil() method in jQuery is used to return all ancestor elements between the selector and stop parameter value.SyntaxThe syntax is as follows −$(selector).parentsUntil(stop, filter)Above, the stop parameter is a selector expression, element or jQuery object. The filter parameter is a selector expression that narrows down the search for ancestors between the selector and the stops parameter.ExampleLet us now see an example to implement the jQuery parentsUntil() method − Live Demo div { width:600px; } .demo * { display: block; border: 2px solid yellow; color: blue; padding: 10px; margin: 10px; } ... Read More
452 Views
The prop() method in jQuery is used to set or return the properties and values of the selected elements.SyntaxThe syntax is as follows −$(selector).prop(property)ExampleLet us now see an example to implement the jQuery prop() method − Live Demo $(document).ready(function(){ $("button").click(function(){ var $val = $("div"); $val.prop("font-size", "1.6em"); $val.append("Property value = " + $val.prop("font-size")); }); }); Adding Property Property OutputThis will produce the following output −Click the button to add a property −
104 Views
The position() method in jQuery is used to return the position of the first matched element. It returns the top and left positions in pixels.SyntaxThe syntax is as follows −$(selector).position()ExampleLet us now see an example to implement the jQuery position() method − Live Demo $(document).ready(function(){ $("button").click(function(){ alert("Top position: " + ($("h3").position()).top + " Left position: " + ($("h3").position()).left); }); }); Heading One Heading Two Heading Three Position of h3 element OutputThis will produce the following output −Click the button to get left and top position of element −
221 Views
The replaceWith() method in jQuery is used to replace selected elements with new content.SyntaxThe syntax is as follows −$(selector).replaceWith(content, function(index))Above, the content parameter is the content to insert, whereas function is to return the content to replace.ExampleLet us now see an example to implement the jQuery replaceWith() method − Live Demo $(document).ready(function(){ $("button").click(function(){ $("h2").replaceWith("This is it!"); }); }); div { margin: 10px; width: 60%; border: 2px dashed orange; padding: 5px; text-align:justify; } Demo Heading Demo ... Read More
172 Views
The fadeout() method in jQuery is used to give a fading effect by changing the opacity for the selected elements. The fading effect changes from visible to hidden.SyntaxThe syntax is as follows −$(selector).fadeOut(speed, easing, callback)Above, the parameter speed is the speed of the fading effect. Here, easing is the speed of the element in different points of the animation, whereas callback is a function to be executed after fadeOut() completes.ExampleLet us now see an example to implement the jQuery fadeout() method − Live Demo $(document).ready(function(){ $("button").click(function(){ $("h2").fadeOut(); ... Read More
219 Views
The hide() method in jQuery is used to hide selected elements.SyntaxThe syntax is as follows −$(selector).hide(speed, easing, callback)Above, the parameter speed is the speed of the hide effect, whereas easing is the speed of the element in different points of the animation. The callback function is a function that executes after hide() method completes.ExampleLet us now see an example to implement the jQuery hide() method − Live Demo $(document).ready(function(){ $(".btnhide").click(function(){ $("p").hide(); }); $(".btnshow").click(function(){ $("p").show(); }); ... Read More