Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Как сделать, чтобы при клике на кнопку «назад» с андройда юзер не вылетел с сайта? (https://javascript.ru/forum/misc/69462-kak-sdelat-chtoby-pri-klike-na-knopku-nazad-s-androjjda-yuzer-ne-vyletel-s-sajjta.html)

drkrol 25.06.2017 14:59

Как сделать, чтобы при клике на кнопку «назад» с андройда юзер не вылетел с сайта?
 
Здравствуйте. В андройде есть вот такой бар:

А у меня есть вот такая самописная "галерея": https://jsfiddle.net/n91jq25b/2/ . Жмёшь на большую — она становится еще больше, жмёшь на превью — она становится на место большой. Чтоб закрыть — нужно кликнуть по экрану.
Косяк в том, что, когда юзер откроет изображение на весь экран с андройда, он может для его закрытия вместо повторного клика по изображению, кликнуть по кнопке назад, которая есть у него на устройстве, на его баре. После этого нажатия юзер вылетит с моего сайта, что мне не нужно. Как сделать так, чтобы юзер не вылетел после нажатия на кнопку "назад", а просто закрыл изображение?

EmperioAf 25.06.2017 17:09

Кнопка назад на телефоне в браузере обыкновенно вызывает window.history.back(), соответственно, помимо того что вы открываете картинку на full нужно еще изменять ссылку. Без перезагрузки страницы это позволяет делать browser history api.
Так что посмотрите в эту сторону. Код вашего приложения при этом, скорее всего очень сильно изменится.
Если писать коряво без нормальных фреймворков, то выглядит примерно так https://jsfiddle.net/n91jq25b/11/, подключено jquery-history, правда в jsfiddle это работать не будет, попробуйте на локальном сервере.
Вообще для решения таких задач обычно используют абстракцию router.

drkrol 25.06.2017 18:16

Решил проблему костылём: https://jsfiddle.net/n91jq25b/15/

var jactive = 0; // создаём переменную

addEventListener("popstate",function(e){
if (jactive == 1) { 
$('.fullimg').fadeOut(); // если переменная = 1, то выполняем какой-то код
$('.fullimgbox').empty()
jactive = 0;
} else {
jactive = 1;  // иначе, делаем переменную = 1.
}
},false);

j0hnik 25.06.2017 22:42

Только теперь не открывается окно увеличенное. в опере по крайней мере.

ruslan_mart 26.06.2017 05:12

А просто добавить #hash при открытии изображения в фулл не?


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