How jquery operates on CSS properties

1. Preface

jquery provides several ways to manipulate the CSS styles of DOM elements, including direct access to and modification of the class property values of DOM elements, as well as access to and modification of CSS property values in DOM elements, as well as a number of ways to directly access and modify the size and position of DOM elements.

jquery provides the following methods for manipulating CSS properties.

1) AddClass (Class): Adds the specified CSS definition to all DOM objects contained in the jquery object.

2) Hasclass (Class): Determines whether the jquery object contains at least one DOM object with the specified CSS definition.

3) Removeclass (Class): Deletes the specified CSS definition on all DOM objects contained by the jquery object.

4) Toggleclass: If you add a Jquey object that has the specified CSS definition on all DOM objects contained in it, delete the CSS definition or add the CSS definition.

5) CSS (name): Returns the value of the CSS property named Naem on the first matching DOM object that the jquery object contains.

6) Cssname,value): Sets a single CSS property value for all DOM objects contained in the jquery object.

7) CSS (properties): Set multiple CSS property values for all DOM objects contained in the jquery object.

8) offset (): Gets the location of the first matching DOM object that the jquery object contains relative to the document.

9) position (): Gets the position of the first matching DOM object that the jquery object contains relative to its parent element.

ScrollTop (): Gets the scroll top value of the first match for all DOM objects contained in the jquery object.

ScrollTop (val): Sets the scrollleft value of all DOM objects contained in the jquery object.

ScrollLeft (): Gets the scrollleft value of all DOM objects contained by the jquery object.

ScrollLeft (val): Gets the scrollleft value of all DOM objects contained by the jquery object.

Height: Returns the current height (in px) of the first matching element in a jquery object

) Height (val): Sets the height of all elements in the jquery object, and Val is px.

() width (): Returns the width of all elements in the jquery object (in px)

Width (val): Sets the width of all elements in the jquery object, and Val is px. 2. Example

The following program demonstrates the development of custom CSS Properties

 <! DOCTYPE html>  

 
3. Running Results