jeena/en.javascript.info
1
0
Fork 0
Code Issues Pull requests Projects Packages Wiki Activity Actions

renovations

Browse source
This commit is contained in:
Ilya Kantor 2015-03-04 23:09:07 +03:00
parent 05d35d0d16
commit 951cf3f2ec
152 changed files with 2527 additions and 2179 deletions
Download patch file Download diff file Expand all files Collapse all files

12
2-ui/1-document/16-metrics-window/document-client-width-height.svg
View file

@ -22,12 +22,12 @@
<text id="document.documentEle" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="bold" fill="#8A704D">
<tspan x="229" y="197">document.documentElement.clientWidth</tspan>
</text>
<path d="M457.012291,168.153273 L277.502296,168.153273" id="Line-3" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47" sketch:type="MSShapeGroup"></path>
<path id="Line-3-decoration-1" d="M278.012291,168.153273 C281.792291,169.203273 285.032291,170.103273 288.812291,171.153273 C288.812291,169.053273 288.812291,167.253273 288.812291,165.153273 C285.032291,166.203273 281.792291,167.103273 278.012291,168.153273 C278.012291,168.153273 278.012291,168.153273 278.012291,168.153273 Z" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47"></path>
<path id="Line-3-decoration-2" d="M456.212291,168.153273 C452.432291,169.203273 449.192291,170.103273 445.412291,171.153273 C445.412291,169.053273 445.412291,167.253273 445.412291,165.153273 C449.192291,166.203273 452.432291,167.103273 456.212291,168.153273 C456.212291,168.153273 456.212291,168.153273 456.212291,168.153273 Z" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47"></path>
<path d="M257.5,151.012291 L257.5,14.5022964" id="Line" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47" sketch:type="MSShapeGroup"></path>
<path id="Line-decoration-1" d="M257.5,15.012291 C256.45,18.792291 255.55,22.032291 254.5,25.812291 C256.6,25.812291 258.4,25.812291 260.5,25.812291 C259.45,22.032291 258.55,18.792291 257.5,15.012291 C257.5,15.012291 257.5,15.012291 257.5,15.012291 Z" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47"></path>
<path id="Line-decoration-2" d="M257.5,150.212291 C256.45,146.432291 255.55,143.192291 254.5,139.412291 C256.6,139.412291 258.4,139.412291 260.5,139.412291 C259.45,143.192291 258.55,146.432291 257.5,150.212291 C257.5,150.212291 257.5,150.212291 257.5,150.212291 Z" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47"></path>
<path d="M457.012291,168.153273 L277.502296,168.153273" id="Line-3" stroke="#EE6B47" stroke-linecap="square" fill="#EE6B47" sketch:type="MSShapeGroup"></path>
<path id="Line-3-decoration-1" d="M278.012291,168.153273 C281.792291,169.203273 285.032291,170.103273 288.812291,171.153273 C288.812291,169.053273 288.812291,167.253273 288.812291,165.153273 C285.032291,166.203273 281.792291,167.103273 278.012291,168.153273 C278.012291,168.153273 278.012291,168.153273 278.012291,168.153273 Z" stroke="#EE6B47" stroke-linecap="square" fill="#EE6B47"></path>
<path id="Line-3-decoration-2" d="M456.212291,168.153273 C452.432291,169.203273 449.192291,170.103273 445.412291,171.153273 C445.412291,169.053273 445.412291,167.253273 445.412291,165.153273 C449.192291,166.203273 452.432291,167.103273 456.212291,168.153273 C456.212291,168.153273 456.212291,168.153273 456.212291,168.153273 Z" stroke="#EE6B47" stroke-linecap="square" fill="#EE6B47"></path>
<path d="M257.5,151.012291 L257.5,14.5022964" id="Line" stroke="#EE6B47" stroke-linecap="square" fill="#EE6B47" sketch:type="MSShapeGroup"></path>
<path id="Line-decoration-1" d="M257.5,15.012291 C256.45,18.792291 255.55,22.032291 254.5,25.812291 C256.6,25.812291 258.4,25.812291 260.5,25.812291 C259.45,22.032291 258.55,18.792291 257.5,15.012291 C257.5,15.012291 257.5,15.012291 257.5,15.012291 Z" stroke="#EE6B47" stroke-linecap="square" fill="#EE6B47"></path>
<path id="Line-decoration-2" d="M257.5,150.212291 C256.45,146.432291 255.55,143.192291 254.5,139.412291 C256.6,139.412291 258.4,139.412291 260.5,139.412291 C259.45,143.192291 258.55,146.432291 257.5,150.212291 C257.5,150.212291 257.5,150.212291 257.5,150.212291 Z" stroke="#EE6B47" stroke-linecap="square" fill="#EE6B47"></path>
</g>
</g>
</svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 6.1 KiB

After

Width:  |  Height:  |  Size: 6 KiB

Before After
Before After

24
2-ui/1-document/17-coordinates/coords.svg
View file

@ -33,18 +33,18 @@
<text id="right" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="bold" fill="#8A704D">
<tspan x="106" y="217">right</tspan>
</text>
<path d="M246.5,145 L246.5,78.5" id="Line" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47" sketch:type="MSShapeGroup"></path>
<path id="Line-decoration-1" d="M246.5,79 C245.45,82.78 244.55,86.02 243.5,89.8 C245.6,89.8 247.4,89.8 249.5,89.8 C248.45,86.02 247.55,82.78 246.5,79 C246.5,79 246.5,79 246.5,79 Z" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47"></path>
<path id="Line-decoration-2" d="M246.5,144.2 C245.45,140.42 244.55,137.18 243.5,133.4 C245.6,133.4 247.4,133.4 249.5,133.4 C248.45,137.18 247.55,140.42 246.5,144.2 C246.5,144.2 246.5,144.2 246.5,144.2 Z" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47"></path>
<path d="M275.5,170.012291 L275.5,78.5" id="Line" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47" sketch:type="MSShapeGroup"></path>
<path id="Line-decoration-1" d="M275.5,79.012291 C274.45,82.792291 273.55,86.032291 272.5,89.812291 C274.6,89.812291 276.4,89.812291 278.5,89.812291 C277.45,86.032291 276.55,82.792291 275.5,79.012291 C275.5,79.012291 275.5,79.012291 275.5,79.012291 Z" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47"></path>
<path id="Line-decoration-2" d="M275.5,169.212291 C274.45,165.432291 273.55,162.192291 272.5,158.412291 C274.6,158.412291 276.4,158.412291 278.5,158.412291 C277.45,162.192291 276.55,165.432291 275.5,169.212291 C275.5,169.212291 275.5,169.212291 275.5,169.212291 Z" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47"></path>
<path d="M222.012291,224.5 L29.5022964,224.5" id="Line-2" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47" sketch:type="MSShapeGroup"></path>
<path id="Line-2-decoration-1" d="M30.012291,224.5 C33.792291,225.55 37.032291,226.45 40.812291,227.5 C40.812291,225.4 40.812291,223.6 40.812291,221.5 C37.032291,222.55 33.792291,223.45 30.012291,224.5 C30.012291,224.5 30.012291,224.5 30.012291,224.5 Z" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47"></path>
<path id="Line-2-decoration-2" d="M221.212291,224.5 C217.432291,225.55 214.192291,226.45 210.412291,227.5 C210.412291,225.4 210.412291,223.6 210.412291,221.5 C214.192291,222.55 217.432291,223.45 221.212291,224.5 C221.212291,224.5 221.212291,224.5 221.212291,224.5 Z" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47"></path>
<path d="M149.012291,188.5 L29.5022888,188.5" id="Line-3" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47" sketch:type="MSShapeGroup"></path>
<path id="Line-3-decoration-1" d="M30.012291,188.5 C33.792291,189.55 37.032291,190.45 40.812291,191.5 C40.812291,189.4 40.812291,187.6 40.812291,185.5 C37.032291,186.55 33.792291,187.45 30.012291,188.5 C30.012291,188.5 30.012291,188.5 30.012291,188.5 Z" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47"></path>
<path id="Line-3-decoration-2" d="M148.212291,188.5 C144.432291,189.55 141.192291,190.45 137.412291,191.5 C137.412291,189.4 137.412291,187.6 137.412291,185.5 C141.192291,186.55 144.432291,187.45 148.212291,188.5 C148.212291,188.5 148.212291,188.5 148.212291,188.5 Z" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47"></path>
<path d="M246.5,145 L246.5,78.5" id="Line" stroke="#EE6B47" stroke-linecap="square" fill="#EE6B47" sketch:type="MSShapeGroup"></path>
<path id="Line-decoration-1" d="M246.5,79 C245.45,82.78 244.55,86.02 243.5,89.8 C245.6,89.8 247.4,89.8 249.5,89.8 C248.45,86.02 247.55,82.78 246.5,79 C246.5,79 246.5,79 246.5,79 Z" stroke="#EE6B47" stroke-linecap="square" fill="#EE6B47"></path>
<path id="Line-decoration-2" d="M246.5,144.2 C245.45,140.42 244.55,137.18 243.5,133.4 C245.6,133.4 247.4,133.4 249.5,133.4 C248.45,137.18 247.55,140.42 246.5,144.2 C246.5,144.2 246.5,144.2 246.5,144.2 Z" stroke="#EE6B47" stroke-linecap="square" fill="#EE6B47"></path>
<path d="M275.5,170.012291 L275.5,78.5" id="Line" stroke="#EE6B47" stroke-linecap="square" fill="#EE6B47" sketch:type="MSShapeGroup"></path>
<path id="Line-decoration-1" d="M275.5,79.012291 C274.45,82.792291 273.55,86.032291 272.5,89.812291 C274.6,89.812291 276.4,89.812291 278.5,89.812291 C277.45,86.032291 276.55,82.792291 275.5,79.012291 C275.5,79.012291 275.5,79.012291 275.5,79.012291 Z" stroke="#EE6B47" stroke-linecap="square" fill="#EE6B47"></path>
<path id="Line-decoration-2" d="M275.5,169.212291 C274.45,165.432291 273.55,162.192291 272.5,158.412291 C274.6,158.412291 276.4,158.412291 278.5,158.412291 C277.45,162.192291 276.55,165.432291 275.5,169.212291 C275.5,169.212291 275.5,169.212291 275.5,169.212291 Z" stroke="#EE6B47" stroke-linecap="square" fill="#EE6B47"></path>
<path d="M222.012291,224.5 L29.5022964,224.5" id="Line-2" stroke="#EE6B47" stroke-linecap="square" fill="#EE6B47" sketch:type="MSShapeGroup"></path>
<path id="Line-2-decoration-1" d="M30.012291,224.5 C33.792291,225.55 37.032291,226.45 40.812291,227.5 C40.812291,225.4 40.812291,223.6 40.812291,221.5 C37.032291,222.55 33.792291,223.45 30.012291,224.5 C30.012291,224.5 30.012291,224.5 30.012291,224.5 Z" stroke="#EE6B47" stroke-linecap="square" fill="#EE6B47"></path>
<path id="Line-2-decoration-2" d="M221.212291,224.5 C217.432291,225.55 214.192291,226.45 210.412291,227.5 C210.412291,225.4 210.412291,223.6 210.412291,221.5 C214.192291,222.55 217.432291,223.45 221.212291,224.5 C221.212291,224.5 221.212291,224.5 221.212291,224.5 Z" stroke="#EE6B47" stroke-linecap="square" fill="#EE6B47"></path>
<path d="M149.012291,188.5 L29.5022888,188.5" id="Line-3" stroke="#EE6B47" stroke-linecap="square" fill="#EE6B47" sketch:type="MSShapeGroup"></path>
<path id="Line-3-decoration-1" d="M30.012291,188.5 C33.792291,189.55 37.032291,190.45 40.812291,191.5 C40.812291,189.4 40.812291,187.6 40.812291,185.5 C37.032291,186.55 33.792291,187.45 30.012291,188.5 C30.012291,188.5 30.012291,188.5 30.012291,188.5 Z" stroke="#EE6B47" stroke-linecap="square" fill="#EE6B47"></path>
<path id="Line-3-decoration-2" d="M148.212291,188.5 C144.432291,189.55 141.192291,190.45 137.412291,191.5 C137.412291,189.4 137.412291,187.6 137.412291,185.5 C141.192291,186.55 144.432291,187.45 148.212291,188.5 C148.212291,188.5 148.212291,188.5 148.212291,188.5 Z" stroke="#EE6B47" stroke-linecap="square" fill="#EE6B47"></path>
</g>
</g>
</svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 7.5 KiB

After

Width:  |  Height:  |  Size: 7.3 KiB

Before After
Before After

12
2-ui/1-document/4-traversing-dom/dom-links-elements.svg
View file

@ -26,17 +26,17 @@
<text id="&lt;DIV&gt;" sketch:type="MSTextLayer" font-family="Open Sans" font-size="14" font-weight="526" sketch:alignment="middle" fill="#8A704D">
<tspan x="201.051859" y="225">&lt;DIV&gt;</tspan>
</text>
<path d="M220.5,200.5 L220.5,174.5" id="Line-6" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47" sketch:type="MSShapeGroup"></path>
<path id="Line-6-decoration-1" d="M220.5,174.5 C219.45,178.28 218.55,181.52 217.5,185.3 C219.6,185.3 221.4,185.3 223.5,185.3 C222.45,181.52 221.55,178.28 220.5,174.5 C220.5,174.5 220.5,174.5 220.5,174.5 Z" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47"></path>
<path d="M267.5,219.5 L427,219.5" id="Line-7" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47" sketch:type="MSShapeGroup"></path>
<path id="Line-7-decoration-1" d="M426.5,219.5 C422.72,218.45 419.48,217.55 415.7,216.5 C415.7,218.6 415.7,220.4 415.7,222.5 C419.48,221.45 422.72,220.55 426.5,219.5 C426.5,219.5 426.5,219.5 426.5,219.5 Z" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47"></path>
<path d="M220.5,200.5 L220.5,174.5" id="Line-6" stroke="#EE6B47" stroke-linecap="square" fill="#EE6B47" sketch:type="MSShapeGroup"></path>
<path id="Line-6-decoration-1" d="M220.5,174.5 C219.45,178.28 218.55,181.52 217.5,185.3 C219.6,185.3 221.4,185.3 223.5,185.3 C222.45,181.52 221.55,178.28 220.5,174.5 C220.5,174.5 220.5,174.5 220.5,174.5 Z" stroke="#EE6B47" stroke-linecap="square" fill="#EE6B47"></path>
<path d="M267.5,219.5 L427,219.5" id="Line-7" stroke="#EE6B47" stroke-linecap="square" fill="#EE6B47" sketch:type="MSShapeGroup"></path>
<path id="Line-7-decoration-1" d="M426.5,219.5 C422.72,218.45 419.48,217.55 415.7,216.5 C415.7,218.6 415.7,220.4 415.7,222.5 C419.48,221.45 422.72,220.55 426.5,219.5 C426.5,219.5 426.5,219.5 426.5,219.5 Z" stroke="#EE6B47" stroke-linecap="square" fill="#EE6B47"></path>
<text id="nextElementSibling" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="bold">
<tspan x="276" y="205" fill="#8A704D">next</tspan>
<tspan x="306.789062" y="205" fill="#EE6B47">Element</tspan>
<tspan x="360.669922" y="205" fill="#8A704D">Sibling</tspan>
</text>
<path d="M168,219.5 L12,219.5" id="Line-8" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47" sketch:type="MSShapeGroup"></path>
<path id="Line-8-decoration-1" d="M12,219.5 C15.78,220.55 19.02,221.45 22.8,222.5 C22.8,220.4 22.8,218.6 22.8,216.5 C19.02,217.55 15.78,218.45 12,219.5 C12,219.5 12,219.5 12,219.5 Z" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47"></path>
<path d="M168,219.5 L12,219.5" id="Line-8" stroke="#EE6B47" stroke-linecap="square" fill="#EE6B47" sketch:type="MSShapeGroup"></path>
<path id="Line-8-decoration-1" d="M12,219.5 C15.78,220.55 19.02,221.45 22.8,222.5 C22.8,220.4 22.8,218.6 22.8,216.5 C19.02,217.55 15.78,218.45 12,219.5 C12,219.5 12,219.5 12,219.5 Z" stroke="#EE6B47" stroke-linecap="square" fill="#EE6B47"></path>
<text id="previousElementSibli" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="bold">
<tspan x="6" y="205" fill="#8A704D">previous</tspan>
<tspan x="67.578125" y="205" fill="#EE6B47">Element</tspan>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 9.8 KiB

After

Width:  |  Height:  |  Size: 9.7 KiB

Before After
Before After

12
2-ui/1-document/4-traversing-dom/dom-links.svg
View file

@ -31,15 +31,15 @@
<text id="&lt;DIV&gt;" sketch:type="MSTextLayer" font-family="Open Sans" font-size="14" font-weight="526" sketch:alignment="middle" fill="#8A704D">
<tspan x="189.051859" y="288">&lt;DIV&gt;</tspan>
</text>
<path d="M208.5,263.5 L208.5,237.5" id="Line" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47" sketch:type="MSShapeGroup"></path>
<path id="Line-decoration-1" d="M208.5,237.5 C207.45,241.28 206.55,244.52 205.5,248.3 C207.6,248.3 209.4,248.3 211.5,248.3 C210.45,244.52 209.55,241.28 208.5,237.5 C208.5,237.5 208.5,237.5 208.5,237.5 Z" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47"></path>
<path d="M255.5,282.5 L368,282.5" id="Line" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47" sketch:type="MSShapeGroup"></path>
<path id="Line-decoration-1" d="M367.5,282.5 C363.72,281.45 360.48,280.55 356.7,279.5 C356.7,281.6 356.7,283.4 356.7,285.5 C360.48,284.45 363.72,283.55 367.5,282.5 C367.5,282.5 367.5,282.5 367.5,282.5 Z" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47"></path>
<path d="M208.5,263.5 L208.5,237.5" id="Line" stroke="#EE6B47" stroke-linecap="square" fill="#EE6B47" sketch:type="MSShapeGroup"></path>
<path id="Line-decoration-1" d="M208.5,237.5 C207.45,241.28 206.55,244.52 205.5,248.3 C207.6,248.3 209.4,248.3 211.5,248.3 C210.45,244.52 209.55,241.28 208.5,237.5 C208.5,237.5 208.5,237.5 208.5,237.5 Z" stroke="#EE6B47" stroke-linecap="square" fill="#EE6B47"></path>
<path d="M255.5,282.5 L368,282.5" id="Line" stroke="#EE6B47" stroke-linecap="square" fill="#EE6B47" sketch:type="MSShapeGroup"></path>
<path id="Line-decoration-1" d="M367.5,282.5 C363.72,281.45 360.48,280.55 356.7,279.5 C356.7,281.6 356.7,283.4 356.7,285.5 C360.48,284.45 363.72,283.55 367.5,282.5 C367.5,282.5 367.5,282.5 367.5,282.5 Z" stroke="#EE6B47" stroke-linecap="square" fill="#EE6B47"></path>
<text id="nextSibling" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="bold" fill="#8A704D">
<tspan x="264" y="268">nextSibling</tspan>
</text>
<path d="M164.5,282.5 L50,282.5" id="Line" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47" sketch:type="MSShapeGroup"></path>
<path id="Line-decoration-1" d="M50.5,282.5 C54.28,283.55 57.52,284.45 61.3,285.5 C61.3,283.4 61.3,281.6 61.3,279.5 C57.52,280.55 54.28,281.45 50.5,282.5 C50.5,282.5 50.5,282.5 50.5,282.5 Z" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47"></path>
<path d="M164.5,282.5 L50,282.5" id="Line" stroke="#EE6B47" stroke-linecap="square" fill="#EE6B47" sketch:type="MSShapeGroup"></path>
<path id="Line-decoration-1" d="M50.5,282.5 C54.28,283.55 57.52,284.45 61.3,285.5 C61.3,283.4 61.3,281.6 61.3,279.5 C57.52,280.55 54.28,281.45 50.5,282.5 C50.5,282.5 50.5,282.5 50.5,282.5 Z" stroke="#EE6B47" stroke-linecap="square" fill="#EE6B47"></path>
<text id="previousSibling" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="bold" fill="#8A704D">
<tspan x="50" y="268">previousSibling</tspan>
</text>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 9.9 KiB

After

Width:  |  Height:  |  Size: 9.8 KiB

Before After
Before After

6
2-ui/2-events-and-interfaces/4-event-bubbling/event-order-bubbling.svg
View file

@ -19,9 +19,9 @@
<text id="3" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="bold" fill="#EE6B47">
<tspan x="157" y="181">3</tspan>
</text>
<text id="Самый-глубокий-элеме" sketch:type="MSTextLayer" font-family="Open Sans" font-size="14" font-weight="526" line-spacing="17" fill="#8A704D">
<tspan x="211" y="181">Самый глубокий </tspan>
<tspan x="211" y="198">элемент</tspan>
<text id="Самый-глубокий-элеме" sketch:type="MSTextLayer" font-family="Open Sans" font-size="14" font-weight="526" sketch:alignment="middle" line-spacing="17" fill="#8A704D">
<tspan x="213.611328" y="181">Самый глубокий </tspan>
<tspan x="243.361328" y="198">элемент</tspan>
</text>
<path d="M170.5,176.5 L200.5,176.5" id="Line-30" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" stroke-dasharray="3,6" sketch:type="MSShapeGroup"></path>
</g>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.1 KiB

After

Width:  |  Height:  |  Size: 3.2 KiB

Before After
Before After

2
2-ui/3-event-details/3-mousemove-mouseover-mouseout-mouseenter-mouseleave/mouseover-mouseout-from-outside.svg
View file

@ -18,7 +18,7 @@
<text id="#TO" sketch:type="MSTextLayer" font-family="Open Sans" font-size="14" font-weight="526" sketch:alignment="middle" fill="#8A704D">
<tspan x="251.150618" y="109">#TO</tspan>
</text>
<path d="M236,94.6353921 L223.12832,94.6353921 L217.344468,101.853926 L105.198001,101.853926 L108.348404,94.146 L82,103.645409 L108.348404,113.146 L105.235092,105.438074 L217.204218,105.438074 L223.12832,112.830378 L236,112.830378 L228.709332,103.733476 L236,94.6353921" id="Fill-21" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47" sketch:type="MSShapeGroup" transform="translate(159.000000, 103.646000) scale(-1, 1) translate(-159.000000, -103.646000) "></path>
<path d="M236,94.6353921 L223.12832,94.6353921 L217.344468,101.853926 L105.198001,101.853926 L108.348404,94.146 L82,103.645409 L108.348404,113.146 L105.235092,105.438074 L217.204218,105.438074 L223.12832,112.830378 L236,112.830378 L228.709332,103.733476 L236,94.6353921" id="Fill-21" stroke="#EE6B47" stroke-linecap="square" fill="#EE6B47" sketch:type="MSShapeGroup" transform="translate(159.000000, 103.646000) scale(-1, 1) translate(-159.000000, -103.646000) "></path>
<text id="target" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="bold" fill="#8A704D">
<tspan x="240" y="80">target</tspan>
</text>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 4 KiB

After

Width:  |  Height:  |  Size: 4 KiB

Before After
Before After

2
2-ui/3-event-details/3-mousemove-mouseover-mouseout-mouseenter-mouseleave/mouseover-mouseout-over-elems.svg
View file

@ -26,7 +26,7 @@
<text id="&lt;DIV&gt;-3" opacity="0.6" sketch:type="MSTextLayer" font-family="Open Sans" font-size="14" font-weight="526" sketch:alignment="middle" fill="#8A704D">
<tspan x="306.384505" y="63">&lt;DIV&gt;</tspan>
</text>
<path d="M401,38.6353921 L375.340223,38.6353921 L363.810075,45.8539263 L140.245366,45.8539263 L146.525714,38.146 L94,47.6454089 L146.525714,57.146 L140.319306,49.4380737 L363.530486,49.4380737 L375.340223,56.8303775 L401,56.8303775 L386.466006,47.7334759 L401,38.6353921" id="Fill-21" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47" sketch:type="MSShapeGroup" transform="translate(247.500000, 47.646000) scale(-1, 1) translate(-247.500000, -47.646000) "></path>
<path d="M401,38.6353921 L375.340223,38.6353921 L363.810075,45.8539263 L140.245366,45.8539263 L146.525714,38.146 L94,47.6454089 L146.525714,57.146 L140.319306,49.4380737 L363.530486,49.4380737 L375.340223,56.8303775 L401,56.8303775 L386.466006,47.7334759 L401,38.6353921" id="Fill-21" stroke="#EE6B47" stroke-linecap="square" fill="#EE6B47" sketch:type="MSShapeGroup" transform="translate(247.500000, 47.646000) scale(-1, 1) translate(-247.500000, -47.646000) "></path>
<text id="mouseover" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="bold" fill="#8A704D">
<tspan x="340" y="17">mouseover</tspan>
</text>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.7 KiB

After

Width:  |  Height:  |  Size: 3.7 KiB

Before After
Before After

4
2-ui/3-event-details/3-mousemove-mouseover-mouseout-mouseenter-mouseleave/mouseover-mouseout.svg
View file

@ -10,11 +10,11 @@
<text id="&lt;DIV&gt;" sketch:type="MSTextLayer" font-family="Open Sans" font-size="14" font-weight="526" sketch:alignment="middle" fill="#8A704D">
<tspan x="119.384505" y="56">&lt;DIV&gt;</tspan>
</text>
<path d="M109,51.8276766 C109,51.8276766 88.1589755,39.0886766 74.3265137,34 C73.990849,36.1044846 73.6561461,38.2078702 73.3204815,40.3112558 C50.6491708,39.1326345 27.6239215,40.8772137 6,45.5449934 C8.76995481,49.733632 11.5399096,53.9217211 14.3098644,58.1098102 C32.5800247,54.1662369 52.0341482,52.6925483 71.1891551,53.6881948 C70.8534905,55.7926793 70.5178258,57.8960649 70.1831229,60 C81.3091081,56.2091804 109,51.8276766 109,51.8276766" id="Fill-55" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47" sketch:type="MSShapeGroup"></path>
<path d="M109,51.8276766 C109,51.8276766 88.1589755,39.0886766 74.3265137,34 C73.990849,36.1044846 73.6561461,38.2078702 73.3204815,40.3112558 C50.6491708,39.1326345 27.6239215,40.8772137 6,45.5449934 C8.76995481,49.733632 11.5399096,53.9217211 14.3098644,58.1098102 C32.5800247,54.1662369 52.0341482,52.6925483 71.1891551,53.6881948 C70.8534905,55.7926793 70.5178258,57.8960649 70.1831229,60 C81.3091081,56.2091804 109,51.8276766 109,51.8276766" id="Fill-55" stroke="#EE6B47" stroke-linecap="square" fill="#EE6B47" sketch:type="MSShapeGroup"></path>
<text id="mouseover" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="bold" fill="#8A704D">
<tspan x="17" y="21">mouseover</tspan>
</text>
<path d="M268,51.8276766 C268,51.8276766 247.158975,39.0886766 233.326514,34 C232.990849,36.1044846 232.656146,38.2078702 232.320481,40.3112558 C209.649171,39.1326345 186.623921,40.8772137 165,45.5449934 C167.769955,49.733632 170.53991,53.9217211 173.309864,58.1098102 C191.580025,54.1662369 211.034148,52.6925483 230.189155,53.6881948 C229.85349,55.7926793 229.517826,57.8960649 229.183123,60 C240.309108,56.2091804 268,51.8276766 268,51.8276766" id="Fill-56" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47" sketch:type="MSShapeGroup"></path>
<path d="M268,51.8276766 C268,51.8276766 247.158975,39.0886766 233.326514,34 C232.990849,36.1044846 232.656146,38.2078702 232.320481,40.3112558 C209.649171,39.1326345 186.623921,40.8772137 165,45.5449934 C167.769955,49.733632 170.53991,53.9217211 173.309864,58.1098102 C191.580025,54.1662369 211.034148,52.6925483 230.189155,53.6881948 C229.85349,55.7926793 229.517826,57.8960649 229.183123,60 C240.309108,56.2091804 268,51.8276766 268,51.8276766" id="Fill-56" stroke="#EE6B47" stroke-linecap="square" fill="#EE6B47" sketch:type="MSShapeGroup"></path>
<text id="mouseoout" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="bold" fill="#8A704D">
<tspan x="176" y="21">mouseoout</tspan>
</text>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.6 KiB

After

Width:  |  Height:  |  Size: 2.6 KiB

Before After
Before After

2
2-ui/3-event-details/3-mousemove-mouseover-mouseout-mouseenter-mouseleave/mouseover-to-child.svg
View file

@ -14,7 +14,7 @@
<text id="#TO" sketch:type="MSTextLayer" font-family="Open Sans" font-size="14" font-weight="526" sketch:alignment="middle" fill="#8A704D">
<tspan x="160.150618" y="88">#TO</tspan>
</text>
<path d="M151,83.0279175 C151,83.0279175 135.824497,73.7186483 125.752316,70 C125.5079,71.5378926 125.264184,73.074982 125.019768,74.6120715 C108.511532,73.7507714 91.7455739,75.0256562 76,78.436726 C78.0169574,81.4976542 80.0339148,84.5581808 82.0508721,87.6187075 C95.3543869,84.7368655 109.520011,83.6599391 123.467831,84.3875269 C123.223415,85.9254195 122.978999,87.462509 122.735284,89 C130.836729,86.2297857 151,83.0279175 151,83.0279175" id="Fill-54" stroke="#EE6B47" stroke-width="2" stroke-linecap="square" fill="#EE6B47" sketch:type="MSShapeGroup"></path>
<path d="M151,83.0279175 C151,83.0279175 135.824497,73.7186483 125.752316,70 C125.5079,71.5378926 125.264184,73.074982 125.019768,74.6120715 C108.511532,73.7507714 91.7455739,75.0256562 76,78.436726 C78.0169574,81.4976542 80.0339148,84.5581808 82.0508721,87.6187075 C95.3543869,84.7368655 109.520011,83.6599391 123.467831,84.3875269 C123.223415,85.9254195 122.978999,87.462509 122.735284,89 C130.836729,86.2297857 151,83.0279175 151,83.0279175" id="Fill-54" stroke="#EE6B47" stroke-linecap="square" fill="#EE6B47" sketch:type="MSShapeGroup"></path>
<text id="mouseover" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="bold" fill="#8A704D">
<tspan x="113" y="59">mouseover</tspan>
</text>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.4 KiB

After

Width:  |  Height:  |  Size: 2.4 KiB

Before After
Before After