Found 730 Articles for JQuery

jQuery slideToggle() Method

AmitDiwan
Updated on 30-Dec-2019 10:03:33

288 Views

The slideToggle() method in jQuery is used to toggle between the slideUp() and slideDown() methods.SyntaxThe syntax is as follows −$(selector).slideToggle(speed, easing, callback)Above, the parameter speed is the speed of the slide effect. Here, easing is the speed of the element in different points of the animation, whereas callback is a function to be executed after slideToggle() completes.Let us now see an example to implement the jQuery slideToggle() method −Example Live Demo    $(document).ready(function(){       $("button").click(function(){          $("p").slideToggle();       });    }); Exam Info Examination begins on 24th December. ... Read More

jQuery slideDown() Method

AmitDiwan
Updated on 30-Dec-2019 10:00:57

254 Views

The slideDown() method in jQuery is used to display the selected elements.SyntaxThe syntax is as follows −$(selector).slideDown(speed, easing, callback)Above, the parameter speed is the speed of the slide effect. Here, easing is the speed of the element in different points of the animation, whereas callback is a function to be executed after slideDown() completes.ExampleLet us now see an example to implement the jQuery slideDown() method − Live Demo    $(document).ready(function(){       $(".button1").click(function(){          $("p").slideUp();       });       $(".button2").click(function(){          $("p").slideDown();       });    }); ... Read More

jQuery innerWidth() with Example

AmitDiwan
Updated on 30-Dec-2019 09:57:24

131 Views

The innerWidth() method in jQuery is used to return the inner width of an element. The method includes padding, but the border and margin aren’t included.SyntaxThe syntax is as follows −$(selector).innerWidth()ExampleLet us now see an example to implement the jQuery innerWidth() method − Live Demo    $(document).ready(function(){       $("button").click(function(){          document.getElementById("demo").innerHTML = "Inner Width of DIV = " + $("div").innerWidth()       });    }); Demo Box Inner Width of div OutputThis will produce the following output −Click the button to get inner width −

jQuery innerHeight() with Examples

AmitDiwan
Updated on 30-Dec-2019 09:52:32

124 Views

The innerHeight() method in jQuery is used to return the inner height. It includes padding, but border and margin are ignored.SyntaxThe syntax is as follows −$(selector).innerHeight()ExampleLet us now see an example to implement the jQuery innerHeight() method− Live Demo    $(document).ready(function(){       $("button").click(function(){          document.getElementById("demo").innerHTML = "Inner Height of DIV = " + $("div").innerHeight()       });    }); Demo Box Inner Height of div OutputThis will produce the following output−Click the button to get Inner Height−

jQuery element + next Selector

AmitDiwan
Updated on 30-Dec-2019 09:49:35

171 Views

The element +next selector in jQuery is used to select the "next" element of the specified "element".SyntaxThe syntax is as follows −("ele + next")Above, ele is any valid selector, whereas the next parameter is used to specify the element that should be the next element of the element parameterExampleLet us now see an example to implement the jQuery element +next 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 ... Read More

jQuery height() with Examples

AmitDiwan
Updated on 30-Dec-2019 09:19:31

182 Views

The height() method in jQuery is used to set or return the height of the selected elements. It does not include padding, border, or margin.SyntaxThe syntax is as follows −$(selector).height() $(selector).height(val)Above, Val in the 2nd syntax is used to specify the height in px, em, pt, etc.ExampleLet us now see an example to implement the jQuery height() method− Live Demo    $(document).ready(function(){       $("button").click(function(){          document.getElementById("demo").innerHTML = "Height of DIV = " + $("div").height()       });    }); Rectangular Box Height of div OutputThis will produce the following output−Click “Height of div”−

jQuery outerWidth() Method

AmitDiwan
Updated on 30-Dec-2019 09:16:28

179 Views

The outerWidth() method in jQuery is used to return the width of an element. The method includes padding and border.OutputThe syntax is as follows−$(selector).outerWidth(margin)Above, the margin is a Boolean value to specify whether or not to include the margin. TRUE is to include the margin.ExampleLet us now see an example to implement the jQuery outerWidth() method− Live Demo    $(document).ready(function(){       $("button").click(function(){          document.getElementById("demo").innerHTML = "Outer Width of DIV = " + $("div").outerWidth()       });    }); Rectangular Box Outer width of div OutputThis ... Read More

jQuery outerHeight() Method

AmitDiwan
Updated on 30-Dec-2019 09:13:20

224 Views

The outerHeight() method in jQuery is used to return the height of an element. The method includes padding and border.SyntaxThe syntax is as follows−$(selector).outerHeight(margin)Above, the margin is a Boolean value to specify whether or not to include the margin. TRUE is to include the margin.ExampleLet us now see an example to implement the jQuery outerHeight() method− Live Demo    $(document).ready(function(){       $("button").click(function(){          document.getElementById("demo").innerHTML = "Outer Height of DIV = " + $("div").outerHeight()       });    }); Rectangular Box Outer height of div OutputThis ... Read More

jQuery Misc param() Method

AmitDiwan
Updated on 30-Dec-2019 08:17:43

153 Views

The param() method in jQuery is used to create a serialized representation of an array or object.SyntaxThe syntax is as follows −$.param(obj, val)Above, obj is the object to serialize, whereas Val specifies whether or not to use the traditional style of param serialization.ExampleLet us now see an example to implement the jQuery param() method− Live Demo    $(document).ready(function(){       ob = new Object();       ob.stdid = "S01";       ob.roll = 3;       $("button").click(function(){          $("p").text($.param(ob));       });    }); Student Details Serialized Representation OutputThis will produce the following output−Click on the button to get serialized representation−

jQuery last() with Examples

AmitDiwan
Updated on 30-Dec-2019 08:07:52

197 Views

The last() method in jQuery is used to return the last element of the selected elements.SyntaxThe syntax is as follows −$(selector).last()ExampleLet us now see an example to implement the jQuery last() method − Live Demo    $(document).ready(function(){       $("div p").last().css("color", "orange");    }); Demo Heading This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. OutputThis ... Read More

Advertisements