Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 25.06.2017, 14:59
Кандидат Javascript-наук
Отправить личное сообщение для drkrol Посмотреть профиль Найти все сообщения от drkrol
 
Регистрация: 09.10.2013
Сообщений: 114

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

А у меня есть вот такая самописная "галерея": https://jsfiddle.net/n91jq25b/2/ . Жмёшь на большую — она становится еще больше, жмёшь на превью — она становится на место большой. Чтоб закрыть — нужно кликнуть по экрану.
Косяк в том, что, когда юзер откроет изображение на весь экран с андройда, он может для его закрытия вместо повторного клика по изображению, кликнуть по кнопке назад, которая есть у него на устройстве, на его баре. После этого нажатия юзер вылетит с моего сайта, что мне не нужно. Как сделать так, чтобы юзер не вылетел после нажатия на кнопку "назад", а просто закрыл изображение?
Ответить с цитированием
  #2 (permalink)  
Старый 25.06.2017, 17:09
Аватар для EmperioAf
Профессор
Отправить личное сообщение для EmperioAf Посмотреть профиль Найти все сообщения от EmperioAf
 
Регистрация: 15.01.2015
Сообщений: 622

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

Последний раз редактировалось EmperioAf, 25.06.2017 в 17:22.
Ответить с цитированием
  #3 (permalink)  
Старый 25.06.2017, 18:16
Кандидат Javascript-наук
Отправить личное сообщение для drkrol Посмотреть профиль Найти все сообщения от drkrol
 
Регистрация: 09.10.2013
Сообщений: 114

Решил проблему костылём: 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);
Ответить с цитированием
  #4 (permalink)  
Старый 25.06.2017, 22:42
Аватар для j0hnik
Профессор
Отправить личное сообщение для j0hnik Посмотреть профиль Найти все сообщения от j0hnik
 
Регистрация: 01.12.2016
Сообщений: 3,650

Только теперь не открывается окно увеличенное. в опере по крайней мере.
Ответить с цитированием
  #5 (permalink)  
Старый 26.06.2017, 05:12
Аватар для ruslan_mart
Профессор
Отправить личное сообщение для ruslan_mart Посмотреть профиль Найти все сообщения от ruslan_mart
 
Регистрация: 30.04.2012
Сообщений: 3,018

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



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как сделать чтобы не перекидывало на другую страницу при отправке сообщения? krasnov8953 Общие вопросы Javascript 12 29.08.2015 18:17
Кратное увеличение при клике на кнопку vabus Элементы интерфейса 2 15.04.2013 20:42
Как сделать, чтобы при изменинении масштабов сайта, он был по середине, а не с края wayzer Элементы интерфейса 7 02.10.2012 16:30
Как сделать что бы при регистрации человека на моем сайте у него не появлялось... drunkwolfs Общие вопросы Javascript 2 07.08.2012 10:58
Как сделать так чтобы при нажатии на лого, он возвращал на главную страницу. Severance Flash 2 01.04.2011 16:25