169 похожих чатов

#Вопрос который я задал вчера, я так увы и не

решил.
Вопрос был про то как отметить отличия на 2 картинках через javascript.

Вот такие варианты решения проблем получил.

1) Высота/ширина картинки, число строк/столбцов известны, так?
Порезать картинку на число квадратов и положить в бекграунды ячеек с background-size: cover. Далее выставляем максимальную ширину блока, и ячейкам даем ширину в процентах. При ресайзе берем текущую ширину и высоту блока и высчитываем пропорционально высоту ячейки. В итоге получим адаптивную картинку. По кликами, например, из дата атрибутов берем значения и складываем в массив. После истечения времени сравниваем полученные значения с ответом. Бинго.)

-это пока звучит как самый работающий вариант но не сильно хочется резать 2 картинки на квадраты. Тем более различия могут быть на стыке квадратов. Ограниченый функционал получается.

2) "Отличия" можно хранить в третьей картинке, того же размера как и обе, с прозрачным фоном и нарисованными разными цветами областями-различиями. Тогда все просто, при клике на картинку пересчитывать координаты клика в координаты клика по картинке, и канвасом проверять "цвет" на тестовой картинке. Найденные цвета - запоминать. Так можно учитывать количество найденных отличий

-этот вариант пробовал но столкнулся с такими проблемами
—- не мог проверить цвет в месте клика на картинке, даже когда она не прозрачная. Не нашёл такого скрипта и функции.

—- не мог выставить поверх картинку, чтобы она идеальна накладывалась на изображение и не смещалась при уменьшении экрана.
У меня там так
<div class=„row”>
<img>
<img>
</div>

Не понимаю куда пихать изображение.
Делать это третим <img> или как background к блоку row

Короче квест есть, решения нет :(
Если кто подскажет то буду благодарен.

1 ответов

5 просмотров

Есть такая олдовая штука в html, image map

Похожие вопросы

Обсуждают сегодня

Всем привет, написал код ниже, но он выдает сегфолт, в чем причина? #include <stdio.h> #include <stdlib.h> #include <string.h> struct product { char *name; float price; };...
buzz базз
32
Хотел бы спросить у знающих, правильную ли я выбрал книгу для начала изучения ассемблера Юрова В.И ? Или есть более лучшие книги для начала обучения?
Botsman
25
Книга Юрова В.И пойдёт для обучения?
Botsman
24
$params = [ 'formid' => 'feedbackForm', 'formTpl' => '@CODE: <form class="form-validate" data-id="ajax_form"> <fieldset class="margin-bottom-md"> ...
Pathologic
1
> Примечательно, что новый владелец удаляет из GitHub любые жалобы, указывающие на подозрительную активность или смену владельца, и, видимо, рассчитывает на то, что пользовате...
Alex Sherbakov
1
Hey there Which is the best Linux destro for developers (coding)? To my research on reddit, they said Linux mint is good for mid level spec and Ubuntu for high Lev hardwar...
Wiz 🪄
11
И ещё вопрос: можно ли типа как на дос как-то запариться и с помощью прерываний выводить текст, вместо функции printf ?
НѣкъиⰘижєжєиꙁъвьсєсвѣтьноѣсѣтиѥсть•
34
а мы ещё не созрели до того, чтобы создать отдельный чатик про настройку редакторов?
Cheese Syrowiecki
16
Всем привет! У меня почему-то по-разному отображается TListView в Debug и Release режимах (FireMonkey)! При запуске под Win приложения TListView заливается программо. в Debug ...
Александр COM
8
Ладно, ещё тупого спрошу. Код должен банально вывести значение регистра на консоль, на деле же не выводя ничего, просто оставляя нерабочую консоль (открыта, ничего не написан...
НѣкъиⰘижєжєиꙁъвьсєсвѣтьноѣсѣтиѥсть•
25
Карта сайта