Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   Как убрать ширину скрола на смартфонах? (https://javascript.ru/forum/events/75573-kak-ubrat-shirinu-skrola-na-smartfonakh.html)

drakulawz 21.10.2018 13:13

Как убрать ширину скрола на смартфонах?
 
Здравствуйте.
Сверстал сайт, получил временный домен и посадил этот сайт на сервер. Всё вроди бы ничего, но вот появилась проблемка с адаптивностью: на ПК всё нормально с разными расширениями, а вот на андроиде появляется белая полоса вместо скрола и теперь можно сдвинуть страничку на эту ширину. Подскажите кто-нибудь как этот баг пофиксить. Я так понимаю это только с JS решается, так как с помощью CSS не нашёл решения?
Если нужно, вот сайт:
tst-js.zzz.com.ua

Вот такую функцию "надумал", стало только хуже - перестала работать "каруселька" и проблема с отступом не исчезла:
function width() {
        var scrollWidth= window.pageYOffset || document.documentElement.scrollWidth,
            window = window.innerWidth;
        if (scrollWidth> 0 && window <= 768) {
            window = document.documentElement.clientWidth;
      }
  }
width();

j0hnik 21.10.2018 15:15

добавьте в css
.row{
margin: 0 !important;
}

MC-XOBAHCK 21.10.2018 15:49

Для менюшки в мобил версии добавьте высоту для блока height: 100vh;
Вот сюда:
@media only screen and (max-width: 768px)
.menu_active {
    left: 0;
    height: 100vh;
}

По моему так лучше.

drakulawz 21.10.2018 17:02

j0hnik, круто! Наверное я гуглить не умею правильно. Всё этот скрол ищу как убрать. Благодарю!

MC-XOBAHCK, я уже переделал правильное отображание, теперь чуть левее и весь текст виден... но... наверное как у вас действительно будет лучше.
Если уж об этом меню говорить, то подскажите как убрать эффект "подскакивания" - когда тянешь пальцем вверх (что бы пролистать вниз) то "гамбургер" подскакивает в верх, при этом обрезается почти на половину его высоты.

Malleys 21.10.2018 17:16

Цитата:

Сообщение от drakulawz
на ПК всё нормально с разными расширениями, а вот на андроиде появляется белая полоса вместо скрола

На ПК нажмите на клавиатуре стрелочку вправо и полоска видна!

Вот решение (полоска убирается и гамбургер не скачет)

html, body {
    overflow: hidden auto;
}

drakulawz 21.10.2018 17:58

Цитата:

Сообщение от Malleys
На ПК нажмите на клавиатуре стрелочку вправо и полоска видна!

:blink: Совсем не заметил этого! Попробовал ваш вариант, работает так же как и вариант j0hnik. Только в вашем варианте страничка (контент) не сужается, что, пожалуй, лучше выглядит. Благодарю!

drakulawz 22.10.2018 18:18

Никто не в курсе, почему после обновления файлов через FTP ничего не поменялось на самом сайте? Обновил ещё сутки назад...



Скинул кеш в браузере и вроде всё норм, так как почти все изменения вступили в силу, но вот эта проблема с белой полоской не исчезла... В брекетсе всё норм, а как на сервер "ложу" всё боком =(



Ага, всё - разобрался... Эта штука (overflow: hidden auto;) не кросбраузерная, в брекетсе работает так как его лайвпревью использует хром - на нём всё ОК, а у меня по умолчанию UCBrowser стоит - на нём не работает (хотя тот же хром, по сути - странно). Добавлю ещё и этот прикол: .row{ margin: 0 !important; }


Странные дела, на всех браузерах работает, а на UC нет... так и осталась эта белая полоса =(


Часовой пояс GMT +3, время: 04:13.