График точек относительно полноэкранного фонового изображения

Question

Я столкнулся с проблемой позиционирования на создаваемом мной сайте.У меня полноэкранное фоновое изображение, которое масштабируется в соответствии с размерами браузера.То, что я хочу сделать, это нанести «точки интереса» на изображение, чтобы при наведении курсора на пользователя появлялось описание.Проблема в том, что изображение будет уменьшаться и увеличиваться в соответствии с размерами браузера, и у меня возникают проблемы с удержанием точки в правильном положении.

Вот тестовая сборка: http://recoverstudio.com/test-build/gallery.html Маленькая "+"это интересный объект.Я хотел бы, чтобы это оставалось на телевизоре при изменении размера окна браузера.

Любая помощь очень ценится.

Answer 1

Глядя на то, как работает ezBgResize, кажется, что вам нужно будет пересчитать позицию каждого интересующего места при изменении размера.

По сути, вам нужно проверить размеры $ ("# jq_ez_bg") и соответственно переместить все ваши точки. Вы, конечно, должны как-то убедиться, что перемещение точек было выполнено после изменения размера изображения.

Answer 2

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

Другой вариант - обработать базовое изображение как векторное изображение, а затем получить всю страницу.быть одним большим изображением SVG.Это позволит вам определить точки в векторном пространстве, которые будут оставаться постоянными при масштабировании.