Окно после изображения
Я хочу, чтобы окно моей программы следовало за Марио img в пределах диапазона вместо прокрутки, по сути, удаляя ползунок и каким-то образом удерживая окно сфокусированным на персонаже Марио (как любая 2D-видеоигра с боковой прокруткой). Любые идеи о том, как сделать это с помощью jQuery или HTML?
Вы можете найти мою программу здесь. Как видно, у меня есть верхнее и нижнее значения, я хочу, чтобы окно показывалось, но у меня нет способа переместить экран, чтобы показать эти границы
РЕДАКТИРОВАТЬ: было бы оптимально переместить счетчик монет, кнопку воспроизведения / паузы музыки, и все, что я добавляю в верхней части экрана с окном. Может контейнер div сделай это? Могу ли я просто использовать движение CSS, чтобы повлиять на все элементы в div?
2 ответа
Для этого я создал временную переменную moveAmount в моем moveMario функция, которая рассчитала расстояние между моими марио img и переменные upperRange а также lowerRangeи переместил div содержит счетчик монет и кнопку воспроизведения / паузы музыки с помощью кода $("#id").animate({"left":"+=" + moveAmount + "px"},1);
Для перемещения реального окна я использовал ту же концепцию, но использовал код window.scrollTo(lowerRange - (1/10)*winWidth, 0); (так как lowerRange изначально был определен как (1/10)*winWidth)
Я действительно горжусь тем, что решил эту проблему после недели пробовать разные вещи.
Смотрите мой рабочий пример здесь!
Вы можете попробовать переместить всю страницу, используя отрицательные поля и оставить IMG после окна с position: fixed,