andre/30-seconds-of-code
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge pull request #1430 from itamar244/patch-1

Browse Source 
Update getElementsBiggerThanViewport.md
This commit is contained in:
Angelos Chalaris
2020-10-08 15:21:32 +03:00
committed by GitHub
parent 8fb9b37d40 84d2584218
commit 4948fc954b
1 changed files with 2 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
snippets/getElementsBiggerThanViewport.md
View File

@ -6,15 +6,12 @@ tags: browser,intermediate
Returns an array of HTML elements whose width is larger than that of the viewport's. Returns an array of HTML elements whose width is larger than that of the viewport's.
- Use `HTMLElement.prototype.offsetWidth()` to get the width of the `document`. - Use `HTMLElement.prototype.offsetWidth()` to get the width of the `document`.
- Use `Array.prototype.reduce()` on the result of `document.querySelectorAll()` to check the width of all elements in the document. - Use `Array.prototype.filter()` on the result of `document.querySelectorAll()` to check the width of all elements in the document.
```js ```js
const getElementsBiggerThanViewport = () => { const getElementsBiggerThanViewport = () => {
const docWidth = document.documentElement.offsetWidth; const docWidth = document.documentElement.offsetWidth;
return [...document.querySelectorAll('*')].reduce((acc, el) => { return [...document.querySelectorAll('*')].filter(el => el.offsetWidth > docWidth);
if (el.offsetWidth > docWidth) acc.push(el);
return acc;
}, []);
} }
``` ```