Почему вкладки закрываются когда на них нажимаешь?

Всплывающее окно («попап» – от англ. Popup window) – один из старейших способов показать пользователю ещё один документ.

В этой статье мы рассмотрим открытие окон и ряд тонких моментов, которые с этим связаны.

Простейший пример:

window.open(«http://ya.ru»);

…При запуске откроется новое окно с указанным URL.

Большинство браузеров по умолчанию создают новую вкладку вместо отдельного окна, но чуть далее мы увидим, что можно и «заказать» именно окно.

Разработчики десктопного Firefox тестируют две новые экспериментальные функции, которые позволят пользователям дополнительно настраивать оформление браузера, а также одновременно просматривать содержимое двух вкладок.

Первая функция под названием Firefox Color даёт возможность менять цвет практически в любой части окна браузера. Вы можете изменить оформление вкладок, адресной строки, иконок и прочих панелей. Получившийся результат можно сохранить в виде схемы оформления и поделиться ею с другими пользователями, готовые темы можно найти .

Более полезной, на наш взгляд, является другая функция, которая называется Side View. Она позволяет просматривать одновременно содержимое двух вкладок в одном окне. Это удобно, если вы располагаете одним монитором и вам требуется сравнить что-либо на двух веб-страницах, например, определённые товары в магазине. Функция активируется нажатием на соответствующий значок на панели, после чего необходимо выбрать любые две вкладки, открытые или недавно просмотренные. В режиме «бок о бок» можно менять область их отображения. Кроме того, такие «парные» просмотры сохраняются в истории, так что в любой момент вкладки можно открыть повторно.

Обе функции доступны в рамках программы тестирования Test Pilot которая позволяет её участникам первыми получить новые функции, прежде чем они появятся в стабильной версии Firefox. Стоит отметить, окончательное решение о реализации экспериментальных возможностей компания принимает на основе собранных данных.

Измените действие для типа содержимого

Вы можете устранить проблему, если вы найдете тип содержимого, настроенного на использование Firefox, и поменяете действие, следуя описанным ниже шагам:

  1. Щёлкните по кнопке меню и выберите НастройкиНастройки.
  2. В панели Основные, перейдите к разделу Файлы и Приложения и просмотрите записи типа контента под Приложения.
  3. Если вы знаете, какой из элементов в колонке Тип содержимого вызывает эту проблему, выберите его. В противном случае напишите в поле поиска Использовать Firefox. Список покажет только те элементы, которые настроены на использование Firefox.
  4. Выберите каждый проблемный тип содержимого и выберите новое действие из выпадающего меню в колонке Действие. Если вы не уверены, которое из них выбрать, выберите Всегда спрашивать.
  5. Закройте страницу about:preferences. Любые сделанные изменения будут сохранены автоматически.

Примечание: Проблемный Portable Document Format (PDF) тип контента должен быть установлен на Предварительный просмотр в FirefoxОткрыть в Firefox для просмотра PDF файлов в Firefox, даже когда Firefox является программой по умолчанию для открытия файлов PDF на Windows.

Для получения дополнительной информации о типах содержимого, прочитайте статью Изменение действия производимого Firefox при щелчке по файлу или его загрузке.

Блокировщик всплывающих окон

Рекламные попапы очень надоели посетителям, аж со времён 20-го века, поэтому современные браузеры всплывающие окна обычно блокируют. При этом пользователь, конечно, может изменить настройки блокирования для конкретного сайта.

Всплывающее окно блокируется в том случае, если вызов window.open произошёл не в результате действия посетителя.

Как же браузер понимает – посетитель вызвал открытие окна или нет?

Для этого при работе скрипта он хранит внутренний «флаг», который говорит – инициировал посетитель выполнение или нет. Например, при клике на кнопку весь код, который выполнится в результате, включая вложенные вызовы, будет иметь флаг «инициировано посетителем» и попапы при этом разрешены.

А если код был на странице и выполнился автоматически при её загрузке – у него этого флага не будет. Попапы будут заблокированы.

Полный синтаксис window.open

Полный синтаксис:

win = window.open(url, name, params)

Функция возвращает ссылку на объект window нового окна, либо null, если окно было заблокировано браузером.

Параметры:

url URL для загрузки в новое окно. name Имя нового окна. Может быть использовано в параметре target в формах. Если позднее вызвать window.open() с тем же именем, то браузеры (кроме IE) заменяют существующее окно на новое. params Строка с конфигурацией для нового окна. Состоит из параметров, перечисленных через запятую. Пробелов в ней быть не должно.

Значения параметров params.

  1. Настройки расположения окна:

left/top (число)

Координаты верхнего левого угла относительно экрана. Ограничение: новое окно не может быть позиционировано за пределами экрана.

width/height (число)

Ширина/высота нового окна. Минимальные значения ограничены, так что невозможно создать невидимое окно с нулевыми размерами.

Если координаты и размеры не указаны, то обычно браузер открывает не окно, а новую вкладку.

  1. Свойства окна:

menubar (yes/no) Скрыть или показать строку меню браузера. toolbar (yes/no) Показать или скрыть панель навигации браузера (кнопки назад, вперёд, обновить страницу и остальные) в новом окне. location (yes/no) Показать/скрыть поле URL-адреса в новом окне. По умолчанию Firefox и IE не позволяют скрывать строку адреса. status (yes/no) Показать или скрыть строку состояния. С другой стороны, браузер может в принудительном порядке показать строку состояния. resizable (yes/no) Позволяет отключить возможность изменять размеры нового окна. Значение no обычно неудобно посетителям. scrollbars (yes/no) Разрешает убрать полосы прокрутки для нового окна. Значение no обычно неудобно посетителям.

  1. Ещё есть небольшое количество не кросс-браузерных свойств, которые обычно не используются. Вы можете узнать о них в документации, например MDN: window.open.

Важно:

Браузер подходит к этим параметрам интеллектуально. Он может проигнорировать их часть или даже все, они скорее являются «пожеланиями», нежели «требованиями».

Важные моменты:

  • Если при вызове open указан только первый параметр, параметр отсутствует, то используются параметры по умолчанию. Обычно при этом будет открыто не окно, а вкладка, что зачастую более удобно.
  • Если указана строка с параметрами, но некоторые yes/no параметры отсутствуют, то браузер выставляет их в no. Поэтому убедитесь, что все нужные вам параметры выставлены в yes.
  • Когда не указан top/left, то браузер откроет окно с небольшим смещением относительно левого верхнего угла последнего открытого окна.
  • Если не указаны width/height, новое окно будет такого же размера, как последнее открытое.

Доступ к новому окну

Вызов window.open возвращает ссылку на новое окно. Она может быть использована для манипуляции свойствами окна, изменения URL, доступа к его переменным и т.п.

В примере ниже мы заполняем новое окно содержимым целиком из JavaScript:

var newWin = window.open(«about:blank», «hello», «width=200,height=200»); newWin.document.write(«Привет, мир!»);

А здесь модифицируем содержимое после загрузки:

var newWin = window.open(‘/’, ‘example’, ‘width=600,height=400’); alert(newWin.location.href); // (*) about:blank, загрузка ещё не началась newWin.onload = function() { // создать div в документе нового окна var div = newWin.document.createElement(‘div’), body = newWin.document.body; div.innerHTML = ‘Добро пожаловать!’ div.style.fontSize = ’30px’ // вставить первым элементом в body нового окна body.insertBefore(div, body.firstChild); }

Обратим внимание: сразу после window.open новое окно ещё не загружено. Это демонстрирует alert в строке (*). Поэтому в примере выше окно модифицируется при onload. Можно было и поставить обработчик на DOMContentLoaded для newWin.document.

Связь между окнами – двухсторонняя.

Родительское окно получает ссылку на новое через window.open, а дочернее – ссылку на родителя window.opener.

Оно тоже может его модифицировать.

Если запустить пример ниже, то новое окно заменит содержимое текущего на ‘Test’:

var newWin = window.open(«about:blank», «hello», «width=200,height=200»); newWin.document.write( «<script>window.opener.document.body.innerHTML = ‘Test'</scr» + «ipt>» ); Same Origin Policy – защита проверкой протокол-сайт-порт

Большинство действий, особенно получение содержимого окна и его переменных, возможны лишь в том случае, если URL нового окна происходит из того же источника (англ. – «Same Origin»), т.е. совпадают домен, протокол и порт.

Иначе говоря, если новое окно содержит документ с того же сайта.

Больше информации об этом будет позже, в главе Кросс-доменные ограничения и их обход.

События

Наиболее важные события при работе с окном браузера:

  • onresize – событие изменения размера окна.
  • onscroll – событие при прокрутке окна.
  • onload – полностью загрузилась страница со всеми ресурсами.
  • onfocus/onblur – получение/потеря фокуса.

Методы и свойства

window.closed Свойство window.closed равно true, если окно закрыто. Может быть использовано, чтобы проверить, закрыл ли посетитель попап. window.close() Закрывает попап без предупреждений и уведомлений. Вообще, метод close() можно вызвать для любого окна, в том числе, текущего. Но если окно открыто не с помощью window.open(), то браузер может проигнорировать вызов close или запросить подтверждение.

Перемещение и изменение размеров окна

Существует несколько методов для перемещения/изменения размеров окна.

win.moveBy(x,y) Перемещает окно относительно текущего положения на x пикселей вправо и y пикселей вниз. Допускаются отрицательные значения. win.moveTo(x,y) Передвигает окно в заданную координатами x и y точку экрана монитора. win.resizeBy(width,height) Изменяет размер окна на заданную величину width/height (ширина/высота). Допускаются отрицательные значения. win.resizeTo(width,height) Изменяет размер окна на заданное значение. Важно:

Чтобы предотвратить использование этих методов с плохими целями, браузеры часто блокируют их выполнение. Как правило, они работают, если окно win открыто вызовом window.open из JavaScript текущей страницы и в нём нет дополнительных вкладок.

Ни свернуть ни развернуть

Заметим, что JavaScript не может ни свернуть ни развернуть ни «максимизировать» (Windows) окно.

Эти функции операционной системы от Frontend-разработчиков скрыты. Вызовы, описанные выше, в случае свёрнутого или максимизированного окна не работают.

Прокрутка окна

Прокрутка окна требуется, пожалуй, чаще всего. Мы уже говорили о ней в главе Размеры и прокрутка страницы:

win.scrollBy(x,y) Прокрутка окна на заданное число пикселей вперёд или назад. Допускаются отрицательные значения. win.scrollTo(x,y) Прокручивает окно к заданным координатам. elem.scrollIntoView(top) Этот метод прокрутки вызывается на элементе. При этом окно прокручивается так, чтобы элемент был полностью видим. Если параметр top равен true или не задан, то верх элемента совпадает с верхом окна. Если он равен false, то окно прокручивается так, чтобы нижний край элемента совпал с нижним краем окна.

Chrome – один из самых популярных браузеров в Интернете. Главное, что Google не стоит на месте и постоянно совершенствует свое приложение. Не так давно журналисты Compuware объявили этот браузер самым быстрым на планете, а компания Tom’s Hardware присвоила ему звание лучшего интернет-обозревателя.

В последней версии Chrome 26, выпущенной в конце марта, Google добавила ряд новых функций, а также убрала за ненужностью некоторые старые. Среди наиболее интересных – значительно улучшен модуль проверки грамматики Spell Checker, который обновлен для всех языков. Обновление пользовательского словаря теперь синхронизируется между компьютерами вместе с другой информацией, которую синхронизирует веб-обозреватель.

В Chrome 26 для Windows появилась возможность сохранять на рабочий стол ярлыки, соответствующие разным пользовательским профилям. Несколько людей, которые работают за одним компьютером, теперь могут удобно создать каждый себе быструю ссылку, соответствующую определенному набору настроек, закладок, кэша, истории для своего профиля.

Шесть новых трюков помогут вам использовать Google Chrome еще более эффективно:

Трюк №1 Начните вводить в омнибокс youtube.com. После появления подсказки нажмите на клавишу Tab. Теперь поисковая строка превратилась в строку поиска по сайту youtube.com! Этот трюк также работает с другими сайтами, чью поисковую систему распознаёт браузер (http://goo.gl/0d0cz).

Трюк №2 Если для открытия ссылки в новой вкладке вы всегда нажимали на неё правой кнопкой мыши и выбирали соответствующий пункт из меню, вы будете рады услышать, что есть гораздо более простой способ. Кликните на ссылку средней кнопкой мыши и она автоматически в новой вкладке без переключения на неё. У вашей мыши нет средней кнопки? Не беда. Зажмите одновременно Control (Command для Mac) и левую кнопку мыши, и получите тот же результат!

Трюк №3 С помощью сочетаний клавиш Shift+средняя кнопка мыши (или Shift+Control/Command+левая кнопка мыши) вы сможете открыть ссылку в новой вкладке, одновременно переключившись на неё.

Трюк №4 Ещё один способ открыть ссылку в новой вкладке. Просто наведите на неё мышь и перетащите на панель вкладок. Теперь вы можете выбрать расположение вкладки, в которой откроется новая ссылка – перед, после или где-то между уже открытыми вкладками.

Трюк №5 Хотите избавиться от необходимости копировать слово, чтобы выполнить поиск по нему? Выделите это слово (или фразу) в тексте на странице браузера и перетащите в омнибокс. Страница с результатами поиска откроется автоматически (только для Windows). Согласитесь, это проще, чем copy paste.

Трюк №6 Как скопировать текст из браузера и вставить его в документ или письмо, очистив форматирование? При копировании используйте классическую комбинацию Ctrl/Command+C, а при вставке – Ctrl/Command+Shift+V.

Как выйти из режима Split View в Safari

Для того чтобы выйти из режима Split View в Safari, просто нажмите и удерживайте кнопку («Новая вкладка»), а затем выберите в контекстном меню опцию «Объединить все вкладки».

Совет: нажмите на , чтобы закрыть каждую вкладку отдельно. Когда вы закроете последнюю из них, браузер автоматически выйдет из режима Split View.

Восстановление закрытой вкладки

Чтобы восстановить случайно закрытую вами вкладку, щёлкните по кнопке меню , затем щёлкните по Журнал и выберите Восстановить закрытые вкладки.

  • Горячие клавиши: Вы также можете нажать Ctrl + Shift + Tcommand + Shift + T, чтобы восстановить последнюю закрытую вами вкладку.

Изменение порядка вкладок

Чтобы переместить вкладку в другую позицию на панели вкладок, просто перетащите её туда с помощью мыши.

Почему браузер закрывается сам по себе?Советы от разработчиков Maxthon

Привет, макстоновцы! В прошлый раз мы говорили о вылетах браузера при запуске. Надеемся, что та статья была достаточно информативна, но вам никогда не придётся использовать наши советы на практике. Ведь Maxthon — один из самых стабильных браузеров!
Продолжаем! Если браузер закрывается сам по себе, пока вы спокойно в нём работаете, на то могут быть следующие причины…

1. Слишком много расширений или их ошибки

Maxthon — один из тех браузер, куда вы можете установить столько расширений, сколько захотите. Но если расширений слишком много, могут возникнуть проблемы. Особенно, если расширения работают с ошибками.
Чтобы избежать подобных проблем, вы могли бы просто удалить ненужные расширения. Но на самом делать это вовсе не обязательно: просто зайдите в Меню → Настройки → Функционал и расширения и снимите галочки с ненужных расширений.

Если поймёте, какое именно расширение мешало работе браузера, и сообщите нам об этом, мы постараемся решить проблему.

2. AdBlock Plus

AdBlock Plus — одна из главных фишек Maxthon. ABP не только блокирует рекламу, но и позволяет настраивать отображение страниц. Но некоторые пользовательские фильтры могут привести к неправильной работе браузера, а иногда и к вылетам. Так что если браузер неожиданно вылетает прямо во время работы, вы можете на время отключить ABP, чтобы убедиться, что он исправен и дело не в нём.

3. Автозаполнение

Если в сбоях в работе браузера виновато автозаполнение, чаще всего это проявляется в зависании на некоторых страницах, на которых присутствует поле логин/пароль. Если с остальными страницами таких проблем не возникает, это повод искать в этом направлении.
Автозаполнение помогает с запоминанием паролей и существенно облегчает жизнь, но иногда оно срабатывает и для страниц, где ничего запоминать не нужно. Если это ваш случай, вы можете отключить автозаполнение в Меню → Настройки → Автозаполнение

4. Нехватка оперативной памяти

Нехватка оперативной памяти тоже может быть причиной вылетов. Понять это довольно просто: обычно в таких случаях вы открываете слишком много вкладок (или же несколько тяжелых), запускаете слишком много расширений. В этом случае вам придётся закрыть ненужные сайты и программы, которые пока не используете.

5. Дополнительные данные о возможных причинах

Всё это общие причины возможных сбоев в браузера, их вы можете проверить самостоятельно. Но если проблема серьёзнее, придётся обратиться в поддержку Maxthon. Наши специалисты помогут разобраться в вашей проблеме.
Чтобы лучше разобраться в проблеме, нам может понадобиться дополнительная информация:

  • операционная система, RAM и т.д.
  • версия браузера
  • защитный софт, установленный на компьютере
  • информация об учетной записи Maxthon
  • отчеты об ошибках

Отчеты об ошибках в работе Maxthon хранятся в папке MaxthonCrashData. Чтобы найти её, используйте сочетание клавиш Win + R и введите команду «%temp%». Скорее всего, вы окажитесь в папке, расположенной по адресу C:\Users\Пользователь\AppData\Local\Temp. Запакуйте папку в архив и отправьте нам для анализа.

Какие устройства поддерживаются

Split View можно использовать на iPad Pro, iPad Air 2 и iPad mini 4. Slide Over работает на iPad Pro, iPad Air и более поздних моделях, а также на iPad mini 2 и более поздних моделях. Оба режима работают как для сторонних приложений, где предусмотрена данная функция, так и для «родных» («Safari», «Заметки», «Фото», «Календарь» и пр.).

Итого

  • Всплывающее окно открывается с помощью вызова window.open(url, name, params).
  • Метод window.open возвращает ссылку на новое окно или null, если окно было заблокировано.
  • Современные браузеры блокируют окна, если window.open вызвано не в результате действия посетителя.
  • Обычно открывается вкладка, но если заданы размеры и позиция – то именно окно.
  • Новое окно имеет ссылку на родительское в window.opener.
  • Окна могут общаться между собой как угодно, если они из одного источника. Иначе действуют жёсткие ограничения безопасности.

Всплывающие окна используются нечасто. Ведь загрузить новую информацию можно динамически, с помощью технологии AJAX, а показать – в элементе <div>, расположенным над страницей (z-index). Ещё одна альтернатива – тег <iframe>.

Но в некоторых случаях всплывающие окна бывают очень даже полезны. Например, отдельное окно сервиса онлайн-консультаций. Посетитель может ходить по сайту в основном окне, а общаться в чате – во вспомогательном.

Если вы хотите использовать всплывающее окно, предупредите посетителя об этом, так же и при использовании target=»_blank» в ссылках или формах. Иконка открывающегося окошка на ссылке поможет посетителю понять, что происходит и не потерять оба окна из поля зрения.

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *