Binds a new DOM Element to this Game Object. If this Game Object already has an Element it is removed from the DOM entirely first. Any event listeners you may have previously created will need to be re-created on the new element.
The element
argument you pass to this method can be either a string tagName:
<h1 id="heading">Phaser</h1>
this.add.dom().setElement('heading');
Or a reference to an Element instance:
<h1 id="heading">Phaser</h1>
var h1 = document.getElementById('heading');
this.add.dom().setElement(h1);
You can also pass in a DOMString or style object to set the CSS on the created element, and an optional innerText
value as well. Here is an example of a DOMString:
this.add.dom().setElement(h1, 'background-color: lime; width: 220px; height: 100px; font: 48px Arial', 'Phaser');
And using a style object:
var style = {
'background-color': 'lime';
'width': '200px';
'height': '100px';
'font': '48px Arial';
};
this.add.dom().setElement(h1, style, 'Phaser');
name | type | arguments | description |
---|---|---|---|
element | string | Element |
If a string it is passed to |
|
style | string | any | <optional> |
Either a DOMString that holds the CSS styles to be applied to the created element, or an object the styles will be ready from. |
innerText | string | <optional> |
A DOMString that holds the text that will be set as the innerText of the created element. |
This DOM Element instance.