Last active
April 29, 2020 12:32
-
-
Save barbudour/09776c7dfd6ed380fe34fd684f259aaa to your computer and use it in GitHub Desktop.
Фикс скрытия верхней панели на горизонтальном мобайле
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| @media (max-width: (768px)) and (orientation: portrait) { | |
| .player__middle--hide { | |
| margin-top: -113px; | |
| } | |
| } |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // Проверяем user-agent | |
| const mobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry|BB|PlayBook|IEMobile|Windows Phone|Kindle|Silk|Opera Mini/i.test(navigator.userAgent); | |
| window.addEventListener('resize', () => { | |
| // Если мобайл и ширина больше высоты вьюпорта (горизонтальное положение) – переключаем класс панели на скрытый | |
| if (mobile && window.innerWidth > window.innerHeight) { | |
| document.querySelector('.player__top').classList.add('player__top--hide') | |
| document.querySelector('.player__models').classList.add('player__middle--hide') | |
| // Возвращаем обратно | |
| } else { | |
| document.querySelector('.player__top').classList.remove('player__top--hide') | |
| document.querySelector('.player__models').classList.remove('player__middle--hide') | |
| } | |
| }) |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment