Как убрать что угодно на любом сайте

Итак, оче­ред­ной сайт решил пере­го­ро­дить вам обзор сво­ей ник­чем­ной напа­дай­кой. Она долж­на про­ви­сеть на экране 10 секунд и толь­ко потом отклю­чить­ся. Но зачем тра­тить 10 секунд жиз­ни, если мож­но отклю­чить напа­дай­ку само­сто­я­тель­но за 8? 

Как работают всплывающие нападайки и поп-апы с рекламой

Такие всплы­ва­ю­щие окна дела­ют­ся очень просто: 

  1. Хозя­е­ва сай­та созда­ют на сво­ей стра­ни­це объ­ект, кото­рый лежит свер­ху все­го, как цел­ло­фан на облож­ке журнала. 
  2. Это­му объ­ек­ту зада­ют шири­ну во весь экран и высо­ту во весь экран, что­бы нель­зя было даль­ше кли­кать и пере­хо­дить по сайту. 
  3. Затем это­му объ­ек­ту уста­нав­ли­ва­ют затем­нён­ный фон. Так появ­ля­ет­ся затем­не­ние все­го экра­на. Имен­но эта шту­ка с затем­не­ни­ем и меша­ет нор­маль­но поль­зо­вать­ся страницей.
  4. Внутрь объ­ек­та с затем­не­ни­ем кла­дут ещё один объ­ект — рекла­му, бан­нер, при­зыв под­пи­сать­ся, пред­ло­же­ние оста­вить свой номер телефона.
  5. И всё это висит попе­рёк страницы

Наша зада­ча — отклю­чить оба объ­ек­та, что­бы они про­па­ли с глаз долой.

Как убрать что угодно на любом сайте

Всё дело — в CSS

Что­бы ком­пью­тер пони­мал, какие эле­мен­ты есть на стра­ни­це, исполь­зу­ют язык HTML, кото­рый гово­рит: «Тут заго­ло­вок, тут ссыл­ка, тут обыч­ный текст, тут кар­тин­ка». А что­бы было ясно, как эти эле­мен­ты долж­ны выгля­деть и рабо­тать, исполь­зу­ют спе­ци­аль­ные пра­ви­ла — их назы­ва­ют сти­ля­ми. Сти­ли зада­ют цвет и внеш­ний вид все­го, что есть на стра­ни­це, а ещё управ­ля­ют раз­ме­ром и пове­де­ни­ем каж­до­го элемента. 

Сти­ли хра­нят­ся в таб­ли­цах, таб­ли­цы назы­ва­ют кас­кад­ны­ми, всё вме­сте назы­ва­ет­ся CSS — cascading style sheets. 

👉 Вот боль­ше при­ме­ров и прак­ти­ки по CSS:

Имен­но воз­мож­но­сти CSS поз­во­ля­ют рисо­вать такие напа­дай­ки, кото­рые зани­ма­ют весь экран и меша­ют читать. Но мы исполь­зу­ем свой­ства CSS про­тив подоб­ных сай­тов и пере­пи­шем всё под себя. Для это­го нам нуж­но будет най­ти код эле­мен­та, кото­рый отве­ча­ет за нападайку.

Как найти код нужного элемента

Что­бы уви­деть, какой имен­но кусок кода отве­ча­ет за всплы­ва­ю­щее окно, будем поль­зо­вать­ся сред­ства­ми само­го бра­у­зе­ра — Инспек­то­ром. В Хро­ме он вызы­ва­ет­ся нажа­ти­ем кла­виш Ctrl+Shift+i, а в Сафа­ри — Cmd+Option+i.

Как убрать что угодно на любом сайте

Но есть ещё один спо­соб, кото­рый сей­час нам под­хо­дит больше:

  1. Откры­ва­ем стра­ни­цу и дожи­да­ем­ся, пока появит­ся реклама. 
  2. Затем пра­вой кноп­кой мыши щёл­ка­ем на кар­тин­ке в цен­тре, кото­рая меша­ет про­смот­ру, и выби­ра­ем «Про­смот­реть код» (Inspect Element).
  3. Инспек­тор сра­зу под­све­тит нуж­ную нам строчку.

Мы нашли уча­сток кода, кото­рый отве­ча­ет за назой­ли­вую рекла­му. Теперь пусть бра­у­зер сам закро­ет окно. Для это­го исполь­зу­ем свой­ство display — оно реша­ет, пока­зы­вать этот эле­мент или нет.

Как убрать что угодно на любом сайте Щёл­ка­ем пра­вой кноп­кой мыш­ки на нуж­ном эле­мен­те и выби­ра­ем «Посмот­реть код». 
Как убрать что угодно на любом сайте Откро­ет­ся панель Инспек­то­ра и под­све­тит нуж­ный уча­сток кода, кото­рый отве­ча­ет за этот элемент. 

Скрываем элемент со страницы

Что­бы окно не пока­зы­ва­лось, нуж­но напи­сать свой­ство display:none. Но быва­ет так, что CSS игно­ри­ру­ет такие коман­ды, если это же свой­ство зада­ёт­ся чуть поз­же в дру­гом месте. Если нуж­но, что­бы коман­да выпол­ни­лась несмот­ря ни на что, после коман­ды пишут сло­во !important — имен­но так, с вос­кли­ца­тель­ным зна­ком в нача­ле. Это гово­рит о том, что у коман­ды при­о­ри­тет над все­ми осталь­ны­ми и её нуж­но исполнять:

display:none !important

Оста­лось вста­вить эту коман­ду в нуж­ное место. Остав­ля­ем синюю линию Инспек­то­ра на той же стро­ке и пере­хо­дим на вклад­ку Styles:

Как убрать что угодно на любом сайте

Там как раз про­пи­са­ны все CSS-стили, кото­рые отве­ча­ют за свой­ства и пове­де­ние это­го эле­мен­та. Нахо­дим в самом вер­ху блок element.style, щёл­ка­ем в нём на сво­бод­ном месте и встав­ля­ем нашу коман­ду display:none !important:

Как убрать что угодно на любом сайте

Кар­тин­ка исчез­ла, но оста­лось затем­не­ние, кото­рое всё рав­но меша­ет читать. Раз­бе­рём­ся и с этим: щёл­ка­ем пра­вой кноп­кой мыши в любом месте затем­не­ния, выби­ра­ем «Посмот­реть код», встав­ля­ем в element.style нашу коман­ду — готово.

Как скрыть что угодно на любом сайте

Это работает только с нападайками?

Этим спо­со­бом мож­но скрыть что угод­но, посколь­ку свой­ство display есть у все­го на стра­ни­це: у ново­стей ВКон­так­те, постов в Facebook или кар­ти­нок в Instagram.

❗️ Важ­ный момент: всё, что мы дела­ем таким обра­зом, про­ис­хо­дит толь­ко внут­ри наше­го бра­у­зе­ра и не вли­я­ет на отоб­ра­же­ние сай­та у дру­гих людей. Если пере­за­гру­зить стра­ни­цу сай­та, то сайт может напасть на вас рекла­мой снова.

Текст:

Миха­ил Полянин

Редак­ту­ра:

Мак­сим Ильяхов

Худож­ник:

Даня Бер­ков­ский

Кор­рек­тор:

Ири­на Михеева

Вёрст­ка:

Мария Дро­но­ва

Соц­се­ти:

Олег Веш­кур­цев