анимированная настольная игра для веб - не Flash - что возможно

Question

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

Каков наилучший способ вставки или удаления текстовой строки или полупрозрачного наложения изображения в произвольном месте (и Z-порядок, заданный относительно существующих объектов) в прямоугольнике настольной игры с кросс-браузерным DHTML?

И как я могу остановить пользователя, выбирающего часть или весь мой монтаж изображений (я просто хочу, чтобы они взаимодействовали с ним , как если бы это был Flash), и могу ли я остановить появление меню по щелчку правой кнопкой мыши? в IE, FF и т.д.?

Я хочу сделать это без Flash, потому что я хочу что-то, что будет работать как на настольных ПК, так и на iPhone и, возможно, на других мобильных платформах.

Я понимаю, что существуют серьезные ограничения (например, меньшие возможности масштабирования изображения, а не вектор, нет возможности поворота) на то, что я могу сделать, если я не использую Flash, но мне очень интересно узнать, какие возможности доступны.

Возможно, существуют ли какие-либо фреймворки, упрощающие кодирование с нуля?

Будет ли J / Query подходить для некоторых требований? Что еще мне нужно?

Answer 1

Я бы порекомендовал Google Web Toolkit . Он позволяет вам программировать на Java, который предоставляет вам все функции безопасности типов и прекрасную функциональность IDE, которые влечет за собой Java, но компилируется в Javascript, чтобы вы могли просто запустить его в браузере. Он также оптимизирует тонну и поддерживает тонну функций.

Answer 2

jQuery отлично справляется с этой задачей. Я использовал пользовательский интерфейс jQuery и функциональность Ajax для реализации интерфейса для игры в шахматы .

Я сделал это немного проще, создав таблицу размером 8 на 8 с уникальными именами div для каждой плитки, чтобы Javascript мог получить к ним доступ, получив элементы по id. Если вы не можете создать что-то подобное, у вас есть возможность разместить элементы в любом месте на странице (либо абсолютные, либо относительно данного элемента). Вы также можете легко изменить z-индекс, в том числе когда пользователь перетаскивает кусок или когда он его уронил.

Что касается отключения правого клика и выбора элемента, я не мог понять, как это сделать. Возможно, вы захотите взглянуть на некоторые другие Ajax-игры, такие как Grand Strategy , которые намного лучше, чем мой эксперимент, и, возможно, уже выяснили, как это сделать.

Answer 3

Существует два основных API для работы с произвольным рисованием и позиционированием в Интернете, Canvas и SVG.

Взгляните на Эксперименты Chrome Canvas и Инструментарий Raphael Javascript , чтобы увидеть некоторые примеры и абстракции Javascript.

Answer 4

Ключ element.style.position = 'absolute'. Чтобы проиллюстрировать только то, что возможно, вот как далеко мне удалось продвинуть javascript (и с нуля!):

• http://slebetman.110mb.com/tank3.html - РТС в ДОМЕ! Нажмите на юниты / отряды, затем нажмите где-нибудь еще, чтобы сказать им, куда идти. Вы можете контролировать обе стороны.