Positioning Container/HTML via a script

Hi, I’m trying to create an html ui for the first time. As objects are clicked on I’d like to have a small html box appear. I’m having a little trouble understanding how to dynamically change the position of the box.

by css asset:

.container {
 float: left;
  width: 20px;
  height: 20px;
  margin: 5px;
  border: 1px solid rgba(0, 0, 0, .2);

in my script on a click event I run some code which creates the html which works fine.

    var style = document.createElement('style');

    // append to head
    style.innerHTML = this.css.resource || '';
    // Add the HTML
    this.div = document.createElement('div');
    this.div.innerHTML = this.html.resource || '';

I’m not sure how to access it and change the position.

I tried using querySelector but getting a null:

  var container= this.div.querySelector('.container');

Any help would be appreciated.

Hi, not sure but have you tryed this.div.enabled=true;

Hi @noah_mizrahi,

I think the querySelector method works only on document element and not on individual elements. So you can use it like this:


That was it. Thank you.

var container = document.querySelector(’.container’) gives me the container and if I want to dynamically change it I use something like:


1 Like