Skip to content

Commit 8f9972b

Browse files
igorMSoaresigorMSoares
committed
docs: fix measurements.md anchors
1 parent 6ced25b commit 8f9972b

File tree

2 files changed

+103
-111
lines changed

2 files changed

+103
-111
lines changed

‎docs/.vitepress/config.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ const md = new MarkdownIt();
77
export default {
88
title: 'Js-Css Animations',
99
description: 'Animate your web apps or site using Javascript',
10+
appearance: 'dark',
1011
markdown: {
1112
anchor: {
1213
getTokensText: tokens => {

‎docs/measurements.md

Lines changed: 102 additions & 111 deletions
Original file line numberDiff line numberDiff line change
@@ -4,177 +4,168 @@ title: measurements
44

55
# measurements
66

7-
<a name="module_measurements"></a>
8-
9-
## measurements
10-
Handle element's width and height calculationsso that, when an element's visibility changes,parent element's dimensions can be properly transitioned
11-
12-
13-
* [measurements](#module_measurements)
14-
* [~measured](#module_measurements..measured)
15-
* [~validateDimension(dimension)](#module_measurements..validateDimension)
16-
* [~getMarginNumericValue(margin)](#module_measurements..getMarginNumericValue) ⇒
17-
* [~getVertMargin(margins, arrLength)](#module_measurements..getVertMargin) ⇒
18-
* [~getHorizMargin(margins, arrLength)](#module_measurements..getHorizMargin) ⇒
19-
* [~getElementMargins(element, axis)](#module_measurements..getElementMargins) ⇒
20-
* [~getElementMeasure(element, dimension)](#module_measurements..getElementMeasure) ⇒
21-
* [~getParentMeasure(element, dimension)](#module_measurements..getParentMeasure) ⇒
22-
* [~getParentMeasures(element)](#module_measurements..getParentMeasures) ⇒
23-
* [~setDimensionMax(element, dimension, value)](#module_measurements..setDimensionMax)
24-
* [~removeDimensionMax(element, dimension)](#module_measurements..removeDimensionMax)
25-
* [~setParentMaxMeasures(args)](#module_measurements..setParentMaxMeasures)
26-
* [~DimensionsMeasurements](#module_measurements..DimensionsMeasurements) : <code>Object</code>
27-
28-
<a name="module_measurements..measured"></a>
29-
30-
### measurements~measured
7+
## measurements.js
8+
9+
Handle element's width and height calculations
10+
so that, when an element's visibility changes,
11+
parent element's dimensions can be properly transitioned
12+
13+
- [measurements](#measurements)
14+
- [measured](#measured)
15+
- [validateDimension(dimension)](#validatedimension-dimension)
16+
- [getMarginNumericValue(margin)](#getmarginnumericvalue-margin)
17+
- [getVertMargin(margins, arrLength)](#getvertmargin-margins-arrlength)
18+
- [getHorizMargin(margins, arrLength)](#gethorizmargin-margins-arrlength)
19+
- [getElementMargins(element, axis)](#getelementmargins-element-axis)
20+
- [getElementMeasure(element, dimension)](#getelementmeasure-element-dimension)
21+
- [getParentMeasure(element, dimension)](#getparentmeasure-element-dimension)
22+
- [getParentMeasures(element)](#getparentmeasures-element)
23+
- [setDimensionMax(element, dimension, value)](#setdimensionmax-element-dimension-value)
24+
- [removeDimensionMax(element, dimension)](#removedimensionmax-element-dimension)
25+
- [setParentMaxMeasures(args)](#setparentmaxmeasures-args)
26+
- [DimensionsMeasurements](#dimensionsmeasurements) : <code>Object</code>
27+
28+
### measured
29+
3130
Tracks whether the parent's element measurement should be before or after the element is set to 'display: none'
3231

33-
**Kind**: inner constant of [<code>measurements</code>](#module_measurements)
34-
<a name="module_measurements..validateDimension"></a>
32+
**Kind**: inner constant of [<code>measurements</code>](#measurements)
33+
34+
### validateDimension(dimension)
3535

36-
### measurements~validateDimension(dimension)
3736
Throws a ReferenceError if 'dimension' is neither 'width' nor 'height'
3837

39-
**Kind**: inner method of [<code>measurements</code>](#module_measurements)
38+
**Kind**: inner method of [<code>measurements</code>](#measurements)
4039

41-
| Param | Type | Description |
42-
| --- | --- | --- |
40+
| Param | Type | Description |
41+
| --------- | ------------------- | -------------------------- |
4342
| dimension | <code>string</code> | Either 'width' or 'height' |
4443

45-
<a name="module_measurements..getMarginNumericValue"></a>
44+
### getMarginNumericValue(margin)
4645

47-
### measurements~getMarginNumericValue(margin) ⇒
4846
Returns only the numeric part of the margin property
4947

50-
**Kind**: inner method of [<code>measurements</code>](#module_measurements)
51-
**Returns**: Margin value without unit
48+
**Kind**: inner method of [<code>measurements</code>](#measurements)
49+
**Returns**: Margin value without unit
5250

53-
| Param | Type | Description |
54-
| --- | --- | --- |
51+
| Param | Type | Description |
52+
| ------ | ------------------- | -------------------------------- |
5553
| margin | <code>string</code> | Margin value along with its unit |
5654

57-
<a name="module_measurements..getVertMargin"></a>
55+
### getVertMargin(margins, arrLength)
5856

59-
### measurements~getVertMargin(margins, arrLength) ⇒
6057
Calculates the total margin of an element in the vertical axis
6158

62-
**Kind**: inner method of [<code>measurements</code>](#module_measurements)
63-
**Returns**: The sum of top-margin and bottom-margin
59+
**Kind**: inner method of [<code>measurements</code>](#measurements)
60+
**Returns**: The sum of top-margin and bottom-margin
6461

65-
| Param | Type | Description |
66-
| --- | --- | --- |
67-
| margins | <code>Array.&lt;string&gt;</code> | Array containing an element's margin values |
68-
| arrLength | <code>number</code> | Number of values declared in the CSS margin property |
62+
| Param | Type | Description |
63+
| --------- | --------------------------------- | ---------------------------------------------------- |
64+
| margins | <code>Array.&lt;string&gt;</code> | Array containing an element's margin values |
65+
| arrLength | <code>number</code> | Number of values declared in the CSS margin property |
6966

70-
<a name="module_measurements..getHorizMargin"></a>
67+
### getHorizMargin(margins, arrLength)
7168

72-
### measurements~getHorizMargin(margins, arrLength) ⇒
7369
Calculates the total margin of an element in the horizontal axis
7470

75-
**Kind**: inner method of [<code>measurements</code>](#module_measurements)
76-
**Returns**: The sum of left-margin and right-margin
71+
**Kind**: inner method of [<code>measurements</code>](#measurements)
72+
**Returns**: The sum of left-margin and right-margin
7773

78-
| Param | Type | Description |
79-
| --- | --- | --- |
80-
| margins | <code>Array.&lt;string&gt;</code> | Array containing an element's margin values |
81-
| arrLength | <code>number</code> | Number of values declared in the CSS margin property |
74+
| Param | Type | Description |
75+
| --------- | --------------------------------- | ---------------------------------------------------- |
76+
| margins | <code>Array.&lt;string&gt;</code> | Array containing an element's margin values |
77+
| arrLength | <code>number</code> | Number of values declared in the CSS margin property |
8278

83-
<a name="module_measurements..getElementMargins"></a>
79+
### getElementMargins(element, axis)
8480

85-
### measurements~getElementMargins(element, axis) ⇒
8681
Element's total margin in a given axis
8782

88-
**Kind**: inner method of [<code>measurements</code>](#module_measurements)
89-
**Returns**: Total margin in a given axis
83+
**Kind**: inner method of [<code>measurements</code>](#measurements)
84+
**Returns**: Total margin in a given axis
9085

91-
| Param | Type | Description |
92-
| --- | --- | --- |
86+
| Param | Type | Description |
87+
| ------- | ------------------------ | ----------------------------------------- |
9388
| element | <code>HTMLElement</code> | The DOM element to calculate margins from |
94-
| axis | <code>string</code> | 'horizontal' or 'vertical' margins |
89+
| axis | <code>string</code> | 'horizontal' or 'vertical' margins |
9590

96-
<a name="module_measurements..getElementMeasure"></a>
91+
### getElementMeasure(element, dimension)
9792

98-
### measurements~getElementMeasure(element, dimension) ⇒
9993
Calculates the total width or height of an element
10094

101-
**Kind**: inner method of [<code>measurements</code>](#module_measurements)
102-
**Returns**: The total dimension of an element, including its margins
95+
**Kind**: inner method of [<code>measurements</code>](#measurements)
96+
**Returns**: The total dimension of an element, including its margins
10397

104-
| Param | Type | Description |
105-
| --- | --- | --- |
106-
| element | <code>HTMLElement</code> | The Dom element to measure |
107-
| dimension | <code>string</code> | Either 'width' or 'height' |
98+
| Param | Type | Description |
99+
| --------- | ------------------------ | -------------------------- |
100+
| element | <code>HTMLElement</code> | The Dom element to measure |
101+
| dimension | <code>string</code> | Either 'width' or 'height' |
108102

109-
<a name="module_measurements..getParentMeasure"></a>
103+
### getParentMeasure(element, dimension)
110104

111-
### measurements~getParentMeasure(element, dimension) ⇒
112105
Calculates the element's parent dimension before and after 'element' is set to 'display: none'
113106

114-
**Kind**: inner method of [<code>measurements</code>](#module_measurements)
115-
**Returns**: An object containing the parent element's dimension before and after the child element is set to 'display: none'
107+
**Kind**: inner method of [<code>measurements</code>](#measurements)
108+
**Returns**: An object containing the parent element's dimension before and after the child element is set to 'display: none'
116109

117-
| Param | Type | Description |
118-
| --- | --- | --- |
119-
| element | <code>HTMLElement</code> | The DOM element from which the parent will be measured |
120-
| dimension | <code>string</code> | Either 'width' or 'height' |
110+
| Param | Type | Description |
111+
| --------- | ------------------------ | ------------------------------------------------------ |
112+
| element | <code>HTMLElement</code> | The DOM element from which the parent will be measured |
113+
| dimension | <code>string</code> | Either 'width' or 'height' |
121114

122-
<a name="module_measurements..getParentMeasures"></a>
115+
### getParentMeasures(element)
123116

124-
### measurements~getParentMeasures(element) ⇒
125-
Calculates the width and height of an element's parent,before and after the element is set to 'display: none'
117+
Calculates the width and height of an element's parent,
118+
before and after the element is set to 'display: none'
126119

127-
**Kind**: inner method of [<code>measurements</code>](#module_measurements)
128-
**Returns**: An object with the width and height of the parent element
120+
**Kind**: inner method of [<code>measurements</code>](#measurements)
121+
**Returns**: An object with the width and height of the parent element
129122

130-
| Param | Type | Description |
131-
| --- | --- | --- |
123+
| Param | Type | Description |
124+
| ------- | ------------------------ | ----------------------------------------------------- |
132125
| element | <code>HTMLElement</code> | The DOM element to get the parent's measurements from |
133126

134-
<a name="module_measurements..setDimensionMax"></a>
127+
### setDimensionMax(element, dimension, value)
135128

136-
### measurements~setDimensionMax(element, dimension, value)
137129
Sets the element's 'max-width' or 'max-height' CSS property
138130

139-
**Kind**: inner method of [<code>measurements</code>](#module_measurements)
131+
**Kind**: inner method of [<code>measurements</code>](#measurements)
140132

141-
| Param | Type | Description |
142-
| --- | --- | --- |
143-
| element | <code>HTMLElement</code> \| <code>null</code> | The DOM element to set max-width or max-height value |
144-
| dimension | <code>string</code> | Either 'width' or 'height' |
145-
| value | <code>string</code> | The CSS property value, in pixels |
133+
| Param | Type | Description |
134+
| --------- | --------------------------------------------- | ---------------------------------------------------- |
135+
| element | <code>HTMLElement</code> \| <code>null</code> | The DOM element to set max-width or max-height value |
136+
| dimension | <code>string</code> | Either 'width' or 'height' |
137+
| value | <code>string</code> | The CSS property value, in pixels |
146138

147-
<a name="module_measurements..removeDimensionMax"></a>
139+
### removeDimensionMax(element, dimension)
148140

149-
### measurements~removeDimensionMax(element, dimension)
150141
Removes the element's 'max-width' or 'max-height' CSS property
151142

152-
**Kind**: inner method of [<code>measurements</code>](#module_measurements)
143+
**Kind**: inner method of [<code>measurements</code>](#measurements)
153144

154-
| Param | Type | Description |
155-
| --- | --- | --- |
156-
| element | <code>HTMLElement</code> \| <code>null</code> | The DOM element to set max-width or max-height value |
157-
| dimension | <code>string</code> | Either 'width' or 'height' |
145+
| Param | Type | Description |
146+
| --------- | --------------------------------------------- | ---------------------------------------------------- |
147+
| element | <code>HTMLElement</code> \| <code>null</code> | The DOM element to set max-width or max-height value |
148+
| dimension | <code>string</code> | Either 'width' or 'height' |
158149

159-
<a name="module_measurements..setParentMaxMeasures"></a>
150+
### setParentMaxMeasures(args)
160151

161-
### measurements~setParentMaxMeasures(args)
162-
Sets element's parent's 'max-width' or 'max-height' property.If 'dimension' is undefined or different from 'all', 'width' or 'height',no property will be set.
152+
Sets element's parent's 'max-width' or 'max-height' property.
163153

164-
**Kind**: inner method of [<code>measurements</code>](#module_measurements)
154+
If 'dimension' is undefined or different from 'all', 'width' or 'height',
155+
no property will be set.
165156

166-
| Param | Type | Description |
167-
| --- | --- | --- |
168-
| args | <code>Object</code> | Object containing all the information needed |
157+
**Kind**: inner method of [<code>measurements</code>](#measurements)
169158

170-
<a name="module_measurements..DimensionsMeasurements"></a>
159+
| Param | Type | Description |
160+
| ----- | ------------------- | -------------------------------------------- |
161+
| args | <code>Object</code> | Object containing all the information needed |
171162

172-
### measurements~DimensionsMeasurements : <code>Object</code>
173-
**Kind**: inner typedef of [<code>measurements</code>](#module_measurements)
163+
### DimensionsMeasurements : <code>Object</code>
164+
165+
**Kind**: inner typedef of [<code>measurements</code>](#measurements)
174166
**Properties**
175167

176-
| Name | Type | Description |
177-
| --- | --- | --- |
168+
| Name | Type | Description |
169+
| ------ | ------------------- | ------------------------------------------------------------------------- |
178170
| height | <code>Object</code> | Element's height before and after child element is set to 'display: none' |
179-
| width | <code>Object</code> | Element's width before and after child element is set to 'display: none' |
180-
171+
| width | <code>Object</code> | Element's width before and after child element is set to 'display: none' |

0 commit comments

Comments
 (0)