Description
Version
- Phaser Version: 3.55.2 / 3.60.0
- Operating system: Windows 10
- Browser: Chrome 116.0.5845.141
Description
The dom elements added to the scene get out of place when the zoom changes.
Example Test Code
Example by slightly modifying in the following link:
https://labs.phaser.io/edit.html?src=src/game%20objects%5Cdom%20element%5Cform%20input.js
class Example extends Phaser.Scene
{
preload ()
{
this.load.html('nameform', 'assets/text/loginform.html');
this.load.image('pic', 'assets/pics/turkey-1985086.jpg');
}
create ()
{
this.add.image(400, 300, 'pic');
const text = this.add.text(10, 10, 'Text', { color: 'white', fontFamily: 'Arial', fontSize: '32px '});
const element = this.add.dom(400, 300).createFromCache('nameform');
// Removed some code before and added this
this.cameras.main.zoomTo(0.5, 2000);
setTimeout(()=>{ this.cameras.main.zoomTo(1.5, 2000) },4000)
}
}
const config = {
type: Phaser.AUTO,
width: 800,
height: 600,
parent: 'phaser-example',
dom: { createContainer: true },
scene: Example
};