Рубрика «модальные окна»

image

Любой создаваемый проект не обходится без динамического создания элементов. Рано или поздно вам понадобится либо создать tooltip для элемента, показать модальное окно, или вовсе сформировать некоторые блоки динамически подгружая их с сервера. При решении таких задач я зачастую определяю зрелость фреймворка, который использую: насколько просто я могу в нем создавать динамический контент, и какие возможности он мне для этого предлагает. В этой статье мы поговорим о динамическом создании контента в новом Angular и рассмотрим различные подходы, которые он нам предоставляет. Читать полностью »

Привет. Я хочу немного поговорить о модальных окнах, которые выпрыгивают, когда едва-едва успел зайти на сайт: контент только-только появился, и уже скрывается за тёмным полупрозрачным покрывалом, поверх которого — как правило бесполезное рекламное объявление.

image
Наугад взятый пример

  • Это невежливо. Пользователь не успел увидеть сайт, как ему уже подсовывают шумный рекламный блок, который поскорее хочется закрыть.
  • Это неюзабельно. Крестик «закрыть окно» маленький; привычный Esc чаще всего не работает. Удивительный эффект: я зашёл на сайт и должен прикладывать усилия, чтобы оказаться внутри и почитать или посмотреть то, ради чего я пришёл.
  • Третий веский аргумент, призванный поддержать два предыдущих.

Читать полностью »

О модальных окнах написано уже, наверное, тонны литературы, но на написание этого топика меня меня сподвигла вот эта статья на хабре. В ней осталось много недосказанного, в том числе горизонтальные скачки как страницы, так и модального окна.
Конечно, можно было бы просто отписаться в комментарих, мол, сделайте так-то и так-то, и все будет тип-топ. Но мой комментарий разросся до размеров новой статьи, с наглядными примерами и комментариями.
Кому стало интересно — добро пожаловать под хабракат!
Читать полностью »

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

Недавно SamDark писал о правильных модальных окнах и представил сообществу плагин The Modal. Полностью согласен с его виденьем модальных окон, но в представленном плагине не хватало функционала. У меня уже давно из проекта в проект кочевали наработки по этой же теме, вот решил тоже оформить их в виде плагина.
Читать полностью »

Очень часто модальные окна и диалоги делаются при помощи плагинов jQuery. Например, SimpleModal или jqModal. К сожалению, все они, в варианте по умолчанию, работают неправильно.

Что же такое «правильно»?

Если окно модальное, то оно обязано быть модальным:

  1. Пользователю нельзя позволять прокручивать страницу под ним.
  2. При этом, если содержимого в модальном окне очень много, нужно позволить прокручивать содержимое.

По этому принципу работает просмотр фото в Facebook и Вконтакте и, я считаю, что для модальных окон это правильный вариант.

Чтобы не мучать вас заранее деталями реализации, покажу сначала демо плагина jQuery: http://rmcreative.ru/playground/modals_plugin/demo.html.

Ну а теперь немного про реализацию.

Читать полностью »


https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js