Draft This page is not complete.
This is an experimental technologyCheck the Browser compatibility table carefully before using this in production.
The CSSMathValue.operator
read-only property of the CSSMathValue
interface indicates the operator that the current subtype represents. For example, if the current CSSMathValue
subtype is CSSMathSum
, this property will return the string "sum"
.
Syntax
var aString = CSSMathValue.operator;
Value
A String
.
Interface | Value |
---|---|
CSSMathSum
|
"sum"
|
CSSMathProduct
|
"product"
|
CSSMathMin
|
"min"
|
CSSMathMax
|
"max"
|
CSSMathClamp
|
"clamp"
|
CSSMathNegate
|
"negate"
|
CSSMathInvert
|
"invert"
|
Examples
We create an element with a width
determined using a calc()
function, then console.log()
the operator
.
<div>My width has a <code>calc()</code> function</div>
We assign a width
with a calculation
div {
width: calc(50% - 0.5vw);
}
We add the JavaScript
const styleMap = document.querySelector('div').computedStyleMap();
console.log( styleMap.get('width') ); // CSSMathSum {values: CSSNumericArray, operator: "sum"}
console.log( styleMap.get('width').values ); // CSSNumericArray {0: CSSUnitValue, 1: CSSMathNegate, length: 2}
console.log( styleMap.get('width').operator ); // 'sum'
console.log( styleMap.get('width').values[1].operator ) // 'negate'
The CSSMathValue.operator
returns sum
for the equation and negate
for the operator on the second value.
Specifications
Specification | Status | Comment |
CSS Typed OM Level 1The definition of 'CSSMathValue.operator' in that specification. | Working Draft | Initial definition. |
Browser compatibility
The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.
No compatibility data found. Please contribute data for "api.CSSMathValue.CSSMathValue.operator" (depth: 1) to the MDN compatibility data repository.
CSSMathValue.operator by Mozilla Contributors is licensed under CC-BY-SA 2.5.