Эксперименты с HTML

+260

SERUGEI_Mtvv в блоге Я рисую обоими копытами

Как-то раз, когда я оформлял очередной пост, я подумал, а возможно ли рисовать спойлерами? Как оказалось, можно.

Прежде чем открывать спойлер, поставьте минимальный масштаб в браузере, а также нажмите «Wide mode».

Многабукав____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________
____________________________________________________________________________________________________

Код арта на pastebin
Использованный софт: degraeve.com для генерации текстового арта, Notepad++ для обработки.

35 комментариев

Надеюсь, я не убью этим ни Свитибота, и бота для постинга в ВК.

SERUGEI_Mtvv 2 июля 2015, 20:57

Upd.: похоже, все живы. Уря.
Upd.2: клиент Табуна для Android не потянул спойлер и вылетел.

SERUGEI_Mtvv 2 июля 2015, 20:59 ↑

В ЯРОК.

SampleText 2 июля 2015, 21:00

Сделано.

SERUGEI_Mtvv 2 июля 2015, 21:11 ↑

Довольно оригинально)

Mira 2 июля 2015, 21:00

Я рисую обоими клавиатурами

RainbowJET 2 июля 2015, 21:12

+16

обеими)

Wolfram 2 июля 2015, 22:05 ↑

Я рисую обоими копытами по обеим клавиатурам обоими обоями

SERUGEI_Mtvv 2 июля 2015, 22:09 ↑

Я рискую ковбоями-кончитами.

f13proxima 2 июля 2015, 22:22 ↑

Написал так как написано в блоге)

RainbowJET 2 июля 2015, 22:19 ↑

Мой профиль в стиме_______________________________________▓▓▓
_______________________________________▓▒▒▒▓▓
____________________▄▄▄▄▄▄▄▄▄________▓▒▒▒▒▒▓
___▓▓▓▓▓____▄█████▓▓▓▓▓▓░░███████▓▒▒▒▒▓▒▓
____▓▒▓▒▓▓▓██▓█▓▓▓▓▓▓▓░░░▓▓▓▓▓▓▓▓▒▒▒▒▒▓▒▓
______▓▒▒▒▓▒▒▓▓▓▓▓▓▓▓░░░▓▓▓▓▓▓▓▓█▒▒▒▒▒▒▓▒▓
______█▓▓▒▒▓▒▒▓▒▒▓▓▓░░░▓▓▓▓▓▓▓▓█▒▒▒▒▒▒▒▓▒▓
____▄█▓▓█▓▓▓▒▒▒▓▒▓▓░░░░▓▓▓▓▓▓▓▓█▒▒▒▒▒▒▓▒▒▓
___█▓▓▓█▓▓█▓▓▒▓▒▓▓▓░░░░▓▓▓▓▓▓▓▓▓█▒▒▒▒▓▒▒▒▓
__█▓▓▓█▓▓█▓▓▓▓▓▓▓▓▓░░░█████████████▒▒▒▒▒▒▓
__█▓▓▓█▓▓█▓▓▓▓▓▓██████▒▌__▓█_____▓▓▒▒▒▒▒▒▒▓
_▐█▓▓█▓▓▓█▓▓████▒▒▒▒▒▒▌__▓▓█▄____▓▓▒▒▒▒▒▒▓
_▐█▓█▓▓▓▓███▒▒▒▒▒▒▒▒▒▒▌__▓▓█████▓▓▒▒▒▒▒▒▓
__█▓█▓▓██_▅▄██▄▒▒▒▒▒▒▒▐___▓▓█▄_██▓▓▄▅▅▒▒▒▓
__█▓▓██__▅▄▄▄▌__▀▄▒▒▒▒▒▐___▓▓▓████▓▅▅▄▒▒▒█
__█▓█_________▓▄___▀▒▒▒▒▒▐____▓▓▓▓▓▓▅▅▄▒▒▒██
__██___________▓▓█▀█▄▒▒▒▒▒▌________▒▒▒▒▒▒█▓█▌
_________________▓▓███▒▒▒▒▒▐____▒▒▒██▒▒██▓██▌
___________________▓▓▓▒▒▒▒▒▒▒▒▒▒▒▒█▓▓██▓▓██▓▌
____________________▓▒▒▄▒▒▌▒▒▒▒▒▒▒█▓▓▓▓██▓▓▓█
___________________▓▒▒▒▒▒▐▒▒▒▒▒▒▒█▓███▓▓▓█▓▓█▌
_____________________▓▓▓▄▀▒▒▒▒▓▓▓█▓▓▓▓▓▓█▓▓▓▓██
_________________________▓▓▓▓▓▓____█▓▓██▀▀█▓▓▓▓░░█
______________________________________▀▀__▄█▓▓▓▓▓░░▓█
_______________________________________▄██▓▓▓▓▓▓░░▓▓█
_____________________________________██▓▓▓▓▓▓▓▓░░▓▓█
______________________________________█▓▓▓▓▓▓▓░░░▓▓█
_______________________________________█▓▓▓▓▓░░░▓▓▓█
________________________________________█▓▓▓░░░▓▓▓▓█
__________________________________________██░░░▓▓▓▓█
_____________________________________________█░▓▓▓█
_______________________________________________████

Gref 2 июля 2015, 21:21

Я изначально планировал сделать именно такую, оказалось, переделать в двухцветный вариант такую картинку весьма неудобно. Пришлось делать из случайного вектора с Гугла.

SERUGEI_Mtvv 2 июля 2015, 21:24 ↑

«Нахуй — Это туда!» ©

EvilKeeper 2 июля 2015, 21:25

А за что минусы-то? Я ж всё аккуратно под спойлеры убрал!

SERUGEI_Mtvv 2 июля 2015, 21:26

У меня растянуто по вертикали.

EudGenius 2 июля 2015, 21:30

Да, боюсь, это из-за шрифта на сайте. В процессе создания всё смотрелось нормально.

SERUGEI_Mtvv 2 июля 2015, 21:32 ↑

Это надо было предусмотреть в процессе создания

andreymal 2 июля 2015, 22:39 ↑

Ну вот теперь буду знать. В следующей постараюсь учесть.

SERUGEI_Mtvv 2 июля 2015, 22:43 ↑

Сколько же ты времени потратил?..

Komar_1458 2 июля 2015, 21:34

Минута на подбор и преобразование картинки, часа три — на коррекцию контуров, ещё полчаса — на оборачивание каждого горизонтального кусочка контура в отдельный спойлер. Всего часов пять, учитывая первую неудачную версию.

SERUGEI_Mtvv 2 июля 2015, 21:37 ↑

У меня теперь юзерпики не грузятся.
Совпадение.жпег

f13proxima 2 июля 2015, 21:38

Прошло, кек.

f13proxima 2 июля 2015, 21:49 ↑

Ну и дичь же ты сотворил)