滚动背景图像
我正在尝试为我正在开发的游戏获取滚动背景图像。上面的代码适用于 Mac 上的 Safari,但不适用于 iPad。我的猜测是,backgroundY 会产生负数,这又会引发错误“INDEX_SIZE_ERR: DOM Exception 1”
backgroundY += 5;
if (backgroundY >= 3834) backgroundY = 0;
bg.drawImage(backgroundImg, 0, -backgroundY, 960, 4930);
关于如何轻松滚动适用于 iPad 的背景图像有什么想法吗?理想情况下,我想实例化图像并让它通过 javascript 而不是 CSS 滚动。如果我可以将图像的注册点更改为右下角,则它永远不会收到负图像。基本上,图像应该在屏幕上向上飞来模拟坠落的感觉。
先感谢您!
I'm trying to get a scrolling background image to work for a game I'm developing. The above code works fine for Safari on a Mac, however, it doesn't work on an iPad. My guess is that the backgroundY is resulting in a negative number which in turn throws me an error "INDEX_SIZE_ERR: DOM Exception 1"
backgroundY += 5;
if (backgroundY >= 3834) backgroundY = 0;
bg.drawImage(backgroundImg, 0, -backgroundY, 960, 4930);
Any ideas on how to easily scroll a background image that will work on the iPad? Ideally I'd like to instance the image and have it scroll through javascript as opposed to CSS. If I could possibly change the registration point of the image to the lower right corner, it wouldn't ever receive a negative image. Basically, the image is supposed to fly upwards on screen to emulate a sense of falling.
Thank you in advance!
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
尝试使用
getImageData
和putImageData
https://developer.mozilla.org/En/HTML/Canvas/Pixel_manipulation_with_canvas
现在我不建议在任何其他情况下这样做,但下面是我使用 get/putImageData 组合在一起的示例。最主要的是你只能获取画布大小范围内的图像数据,放回图像数据也是如此。在下面的示例中,没有使用负值。
实例
Try using
getImageData
, along withputImageData
https://developer.mozilla.org/En/HTML/Canvas/Pixel_manipulation_with_canvas
Now I dont recommend doing this for any other circumstance, but below is an example I put together using get/putImageData. The main thing is you can only get image data thats within the size of your canvas, and the same goes with putting back the imagedata. In the below example no negative values are used.
Live Example