Working with CSS

Working with CSS

The .css() function allows us either to take the value of a css property or to set it from the beginning. That depends on the number of the arguments that are going to be passed:

$(selector).css('property') => Returns the value of this css property.

$(selector).css('property', 'value') => Sets the css property of a selector to the specified value.

If you want to specify more than one properties and give values to them you can do so by passing an object as a parameter. Inside the Object you can have your key-value pairs as normally.

$(selector).css({'firstProp': 'firstValue', 'secondProp': 'secondValue', 'thirdProp':'thirdValue'});

Additonally if we want to work with classes, there 3 possible functions exactly like in vanillaJS:

$(selector).addClass('classToAdd'); => Adds a new class to the selector element

$(selector).removeClass('classToRemove'); => Removes this class from the selector element

$(selector).toggleClass('classToToggle'); => Adds the class if not there, removes it if present.