Pull to refresh
23
0
Sergey Toy @Toy

Professional nerd

Send message

Стартовал краудсорсинговый перевод OWASP Testing Guide 4.0 на 30+ языков (в т. ч. и на русский)

Reading time 1 min
Views 14K
image

Сегодня в твиттере проекта OWASP появилась запись, приглашающая всех желающих присоединиться к переводу OWASP Testing Guide 4.0.

Присоединиться к переводу можно здесь.
Что за OWASP такой и немного подробнестей
Total votes 14: ↑14 and ↓0 +14
Comments 2

То, что вам никто не говорил о z-index в статье «То, что вам никто не говорил о z-index»

Reading time 2 min
Views 45K
image
Почти два года назад вышла статья «What no one told you about z-index» (и её перевод на Хабре «То, что вам никто не говорил о z-index»), авторы которой рассказывают о малоизвестной (76% проголосовавших пользователей Хабра слышат об этом впервые), но документированной возможности создания нового контекста наложения указав opacity меньше единицы.

Но несмотря на название статьи, авторы не рассказали вам ещё кое о чём.

Предполагается, что вы знакомы с понятием контекста наложения (англ. stacking context).
Элементы с общими родителями, перемещающиеся на передний или задний план вместе известны как контекст наложения. Понимание контекста наложения является ключом к пониманию z-index и порядка наложения элементов.

Каждый контекст наложения имеет свой корневой элемент в HTML структуре. В момент формирования нового контекста на элементе, все дочерние элементы так же попадают в этот контекст и занимают своё место в порядке наложения. Если элемент располагается в самом низу одного контекста наложения, то никаким мыслимым и немыслимым образом не получится отобразить его над другим элементом в соседнем контексте наложения, располагающимся выше по иерархии, даже с установленным z-index равным миллиону.
— Из статьи «То, что вам никто не говорил о z-index». Для понимания темы настоятельно рекомендую к ознакомлению либо её, либо классический труд на MDN.

Новый контекст наложения формируется в случаях:

  • Корневой элемент () всегда содержит корневой контекст наложения. Любой элемент на странице, не участвующий в локальном контексте наложения (сформированном любым из последующих вариантов), участвует в корневом контексте наложения.
    Элемент с position отличным от static и значением z-index отличным от auto. Кроме одного исключения для position: fixed, но я это вынес в отдельный пункт.
    Элемент имеет значение opacity меньше, чем 1.
Нужно больше контекстов наложения!
Total votes 45: ↑42 and ↓3 +39
Comments 12

Canvas Indicator — альтернатива для AjaxLoad.gif

Reading time 3 min
Views 2.9K
Многие наверняка используют индикаторы процесса, например, когда передаете/получаете какие-нибудь данные через AJAX.

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

Делать специальный GIF под каждую ситуацию довольно глупо. Поэтому правильное решение — использовать Canvas.

Если вы еще не решили эту проблему, я жду вас под катом
Total votes 71: ↑59 and ↓12 +47
Comments 74

Information

Rating
Does not participate
Location
Сингапур, Сингапур, Сингапур
Date of birth
Registered
Activity