网页动画棋盘游戏 - 不是 Flash - 有什么可能？
为我的网页上的矩形游戏区域获取平面鼠标坐标输入数据和鼠标事件的简单回调的最佳跨浏览器方法是什么，即使它有大量较大和较小的图像和文本字符串随意覆盖在其上？
使用跨浏览器 DHTML 在棋盘游戏矩形中的任意位置（和 Z 顺序，相对于现有对象指定）插入或删除文本字符串或半透明图像叠加层的最佳方法是什么？
我怎样才能阻止用户选择部分或全部图像蒙太奇（我只是希望他们与它交互就像它是Flash），我可以停止出现右键菜单吗IE、FF 等？
我想在不使用 Flash 的情况下完成此操作，因为我想要一些可以在桌面和 iPhone 以及可能的其他移动平台上运行的东西。
我知道如果我不使用Flash，我能做的事情会受到严重的限制（例如图像缩放功能较少，不是矢量，没有旋转功能），但我很想知道有哪些功能可用。
是否有任何框架可以使其比从头开始编码更容易？
J/Query 能很好地满足某些要求吗？我还需要什么？
What is the best cross-browser way to get a flat mouse coordinate input data and simple callback for mouse events for my rectangular game area on my web page, even when it has loads of larger and smaller images and text string overlaid haphazard onto it?
And what is the best way to insert or remove a text string or semi-transparent image overlay at an arbitrary location (and Z order, specified relative to existing objects) in a board game rectangle with cross-browser DHTML?
And how can I stop the user selecting part or all of my montage of images (I just want them to interact with it as if it was Flash), and can I stop the right click menus coming up in IE, FF etc?
I want to do this without Flash because I want something that will work both on desktops and on iPhone and potentially other mobile platforms too.
I appreciate there are serious limitations (eg less image scaling capabilities, not vector, no rotation capability) to what I can do if I'm not using Flash but I'm very interested to know what capabilities are available.
Are there perhaps any frameworks available to make it easier than coding from scratch?
Would J/Query be a good match for some of the requirements? What else do I need?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（4）
我推荐 Google Web Toolkit。它允许您使用 Java 进行编程，这为您提供了 Java 所需的所有类型安全和良好的 IDE 功能，但编译为 Javascript，以便您可以在浏览器中运行它。它还进行了大量优化并支持大量功能。
I would recommend Google Web Toolkit. It lets you program in Java, which gives you all the type-safety and nice IDE functionality that Java entails, but compiles to Javascript so that you can just run it in a browser. It also does a ton of optimization and supports tons of features.
jQuery 非常擅长做到这一点。我使用 jQuery 的 UI 和 Ajax 功能来实现国际象棋游戏的前端。
我通过为每个图块创建一个具有唯一 div 名称的 8×8 表来使其变得更容易一些，这样 Javascript 就可以通过 id 获取元素来访问它们。如果您无法创建类似的内容，您可以选择将元素放置在页面上的任何位置（绝对或相对于给定元素）。您还可以轻松更改 z 索引，包括当用户拖动棋子或放下棋子时。
至于禁用右键单击和项目选择，我不知道该怎么做。您可能想看看其他一些 Ajax 游戏，例如 Grand Strategy，这些游戏更加精致比我的实验更好，可能已经弄清楚如何做到这一点。
jQuery is excellent at doing this. I used jQuery's UI and Ajax functionality to implement the frontend for a game of chess.
I made it a little easier by creating an 8-by-8 table with unique div names for each tile, so Javascript can access them by getting the elements by id. If you can't create something like that, you do have the option of placing elements anywhere on the page (either absolute or relative to a given element). You can also easily change the z-index, including when the use is dragging a piece or when they have dropped it.
As far as disable right click and item selection goes, that's something that I didn't figure out how to do. You might want to take a look at some other Ajax games like Grand Strategy, which are much more polished than my experiment and may have figured out how to do this.
有两个主要的 API 可用于在 Web 上进行任意绘图和定位：Canvas 和 SVG。
查看 Chrome Canvas 实验 和 Raphael Javascript 工具包 查看一些示例和 Javascript 抽象。
There are two main APIs for working with arbitrary drawing and positioning on the web, Canvas and SVG.
Take a look at Chrome Canvas Experiments and the Raphael Javascript toolkit to see some examples and Javascript abstractions.
关键是
element.style.position = 'absolute'。为了说明什么是可能的，这里是我已经设法推动 javascript 的程度（从头开始！）：The key is
element.style.position = 'absolute'. To illustrate just what's possible here's how far I've managed to push javascript (and from scratch at that!):