Category Archives: Jquery
jQuery width Method
jQuery width Method : is used to get or set the width of selected element. If want to set width of element pass width in .width() as input parameter.
We are going to explain jquery width method with example and demo.
jQuery width Method Syntax 1 Get Width
In this example we will get width of element using .width() method.
$(selector).width();
jQuery width() Method Example 1
Below example shows the get width method functionality –
jQuery width Method Syntax 2 – Set Width
If you want to add width dynamically you can use width method as below-
$(selector).width(width);
width(px): Width in pixel.
jQuery width() Method Example 2
Here is an example of set width method –
jQuery scrollTop Method
jQuery .scrollTop Method : is used to get or set the vertical scrollbar position of the selected element.
jQuery scrollTop Method Syntax 1 – Get The Position
Syntax for get position of scrollbar from top –
$(selector).scrollTop();
jQuery scrollTop() Method Example 1
Below example shows the position of the scrollbar from the top-
jQuery scrollTop Method Syntax 2 – Set The Position
Syntax to set position of the scrollbar from top –
$(selector).scrollTop(position);
position(px): Pixel position to be scrolled.
jQuery scrollTop() Method Example 2
Here is an example which will set position of scrollbar from top –
The above example will produce output something like this –
jQuery scrollLeft Method
jQuery .scrollLeft Method : is used to get or set the horizontal scrollbar position of the selected element. .scrollLeft() is used to set or get the scrollbar position. If you want to set position of scrollbar pass value in pixel as input parameter.
We are going to explain both example with demo and example.
jQuery scrollLeft Method Syntax 1 – Get The Position
Syntax for scrollLeft Method –
$(selector).scrollLeft();
jQuery scrollLeft() Method Example 1
Below example shows the scrollLfet method get scrollbar position method –
jQuery scrollLeft Method 2 – Set The Position
Syntax for set position –
$(selector).scrollleft(position);
position(px): Pixel position to be scrolled.
jQuery scrollLeft() Method Example 2
Below example will set position 100 from left –
Here is output of the example –
jQuery css Method
jQuery css Method : is used to add the css styles to the selected elements.
Syntax 1
$(selector).css(propertyName);
propertyName(String): Css Style to be added.
jQuery css() Method Example 1
Syntax 2 for jQuery css Method
$(selector).css(propertyNames);
propertyNames (Array): List of styles in form of array.
Example : {‘background’:’yellow’,’font-size’:’24px’,’border’:’2px solid red’}
jQuery css() Method Example 2
jQuery toggleClass Method
jQuery toggleClass Method : is used to toggle class(es) to the selected elements. It Adds the class if it is not there on selected element and if it is there, it removes the class.
Syntax jQuery toggleClass Method
Here is syntax to create toggle class functionality-
$(selector).toggleClass(classname,function(index,currentClassName));
index: (Interger) Index of the current element in the current set.
toggleClassName(String)Current Class name in the matching set.
jQuery toggleClass() Method Example 1
The above code will produce following result-
Note : This is screenshot of the output. To run this demo click on the above “Try it” button.
jQuery removeClass Method
jQuery removeClass Method : is used to remove the classes from the selected elements.
Syntax : jQuery removeClass Method
$(selector).removeClass(classname,function(index,currentClassName));
index: (Interger) Index of the current element in the current set.
currentClassName(String)Current Class name in the matching set.
