diff --git a/src/components/networked-video-player.js b/src/components/networked-video-player.js
index 77417c6e5bd6bfb42484f86024f4ae63999cc9ee..e00dfbf15296c5d52736254706ad3ca44e73ca6f 100644
--- a/src/components/networked-video-player.js
+++ b/src/components/networked-video-player.js
@@ -7,6 +7,7 @@ const nafConnected = function() {
       : document.body.addEventListener("connected", resolve);
   });
 };
+
 AFRAME.registerComponent("networked-video-player", {
   schema: {},
   async init() {
@@ -20,9 +21,7 @@ AFRAME.registerComponent("networked-video-player", {
     }
 
     const ownerId = networkedEl.components.networked.data.owner;
-
     const stream = await NAF.connection.adapter.getMediaStream(ownerId);
-
     if (!stream) {
       return;
     }
diff --git a/src/components/offset-relative-to.js b/src/components/offset-relative-to.js
new file mode 100644
index 0000000000000000000000000000000000000000..923eae3e5673488e8eceb726b9e91f592285f546
--- /dev/null
+++ b/src/components/offset-relative-to.js
@@ -0,0 +1,32 @@
+AFRAME.registerComponent("offset-relative-to", {
+  schema: {
+    target: {
+      type: "selector"
+    },
+    offset: {
+      type: "vec3"
+    },
+    on: {
+      type: "string"
+    }
+  },
+  init() {
+    this.updateOffset();
+    this.el.sceneEl.addEventListener(
+      this.data.on,
+      this.updateOffset.bind(this)
+    );
+  },
+  updateOffset() {
+    const offsetVector = new THREE.Vector3().copy(this.data.offset);
+    this.data.target.object3D.localToWorld(offsetVector);
+    this.el.setAttribute("position", offsetVector);
+
+    const headWorldRotation = this.data.target.object3D.getWorldRotation();
+    this.el.setAttribute("rotation", {
+      x: headWorldRotation.x * THREE.Math.RAD2DEG,
+      y: headWorldRotation.y * THREE.Math.RAD2DEG,
+      z: headWorldRotation.z * THREE.Math.RAD2DEG
+    });
+  }
+});
diff --git a/src/index.js b/src/index.js
index e8ada8c22bf3c56a20eabe589d8ade80192fa480..41760f90bd34b7b6e71b524cec3f48a7ef673d37 100644
--- a/src/index.js
+++ b/src/index.js
@@ -20,6 +20,7 @@ import "./components/hand-controls2";
 import "./components/character-controller";
 import "./components/split-axis-events";
 import "./components/networked-video-player";
+import "./components/offset-relative-to";
 import "./systems/personal-space-bubble";
 
 import registerNetworkScheams from "./network-schemas";
@@ -30,21 +31,6 @@ import Config from "./config";
 registerNetworkScheams();
 registerInputMappings();
 
-function updateVideoElementPosition(entity) {
-  const headEl = document.querySelector("#head");
-
-  const offset = new THREE.Vector3(0, 0, -2);
-  headEl.object3D.localToWorld(offset);
-  entity.setAttribute("position", offset);
-
-  const headWorldRotation = headEl.object3D.getWorldRotation();
-  entity.setAttribute("rotation", {
-    x: headWorldRotation.x * THREE.Math.RAD2DEG,
-    y: headWorldRotation.y * THREE.Math.RAD2DEG,
-    z: headWorldRotation.z * THREE.Math.RAD2DEG
-  });
-}
-
 function shareScreen() {
   const track = NAF.connection.adapter.localMediaStream.getVideoTracks()[0];
 
@@ -54,15 +40,17 @@ function shareScreen() {
     const sceneEl = document.querySelector("a-scene");
     entity = document.createElement("a-entity");
     entity.id = id;
-    entity.setAttribute("networked", "template: #video-template");
+    entity.setAttribute("offset-relative-to", {
+      target: "#head",
+      offset: "0 0 -2",
+      on: "action_share_screen"
+    });
+    entity.setAttribute("networked", { template: "#video-template" });
     sceneEl.appendChild(entity);
   }
 
   track.enabled = !track.enabled;
   entity.setAttribute("visible", track.enabled);
-  if (track.enabled) {
-    updateVideoElementPosition(entity);
-  }
 }
 
 window.App = {