Make a button in A-Frame

Coding Help
1

Howdy friends! Can anyone help me create a button in A-Frame that links to another web page? Thanks!!!

2

Hi chris. are you creating one for webvr or webar? do u mean a html tag button thats on screen or a object that you want to have a click function on it? either way the javascript could be:

$("#opengooglebutton").on("click", function() {
    window.open("https://www.google.com/", "_blank");
  });

for on screen purposes :

<div
  style="position: fixed; top: 10px; width:100%; text-align: center; z-index: 1;"
>
  <button id="opengooglebutton">
    open google
  </button>
</div>

for objects just make sure to change the name in this $("#opengooglebutton") to the object u want to click.

heres a glitch to see it working

1 Like
3

Thank you so much for responding!

I am created an isometric 3D map of buildings and basically just want to be able to click on the different buildings and have them take you to a new web page to explore within the buildings. Or click them to give you a little box with info. Things like that.

Does that makes sense? If it worked in web VR that would be awesome too.

So could I basically put this javascript code you suggested into my html document?

4

One more question: How could I possibly name a 3D model and then click on that model?

Thank you!
Chris

5

Hi, chris! so sorry. missed the notifications. Yes, i understand. I worked on a project that sounds exactly like what u are doing. You can just use the javascript code in ur html document. as all its doing is getting the referenced element (the id - #) and opening a url.

for the second question, like i said in my previous answer “for objects just make sure to change the name in this $("#opengooglebutton") to the object u want to click.” so use the same script for ur 3d models. just reference the id of ur 3d model instead of opengooglebutton.