How to get the space to open in a new window3628
Pages:
1
|
terrygrant private msg quote post Address this user | |
| I am setting up my website and need to know how to get the embed code that matterport sends me to open full screen when the thumbnail is clicked on (I have reduced the frame size as I want a gallery). Can anyone help me with this? <iframe width="310" height="250" src="https://my.matterport.com/show/?m=4HuUTo3K9KS" frameborder="0" allowfullscreen></iframe> Thanks Terry |
||
| Post 1 • IP flag post | ||
|
homepagerealty private msg quote post Address this user | |
| You're using the embed code, so you'll have to hyperlink a custom thumbnail image instead. Use the following example with your own image URL in the src tag to have its work. <a href="https://my.matterport.com/show/?m=4HuUTo3K9KS" target="_blank"><img src="IMAGE URL GOES HERE" width="310" height="250"></a> |
||
| Post 2 • IP flag post | ||
|
|
terrygrant private msg quote post Address this user | |
| That's really helpful thanks very much. Is is it possible to make it start as a non full screen separate window so it is clear how to get back/out? And is there a source of detailed information about this side of things (Short of learning full blown HTML :-) ? Thanks again Terry |
||
| Post 3 • IP flag post | ||
|
|
homepagerealty private msg quote post Address this user | |
| That kind of coding would have to be on Matterport's side, but since its loading a WebGL or Unity box with all the assets, I don't think there is a way to click inside Matterport and have it load somewhere else through their embed/link. I've not seen a resource, but its what we use in office (theres a web guy) to get stuff done. |
||
| Post 4 • IP flag post | ||
Frisco, Texas |
Metroplex360 private msg quote post Address this user | |
| If you are using WordPress, you might like my shortcode plugin that uses a light box overlay. Matterapps.com | ||
| Post 5 • IP flag post | ||
|
|
UserName private msg quote post Address this user | |
| Do you want to give users the ability to click an image thumbnail and switch to fullscreen in the current tab? Or open a separate popup window? Or open in fullscreen in a different tab? If so, you can do that with a little code that calls the fullscreen api that works in all modern browser. See it in action by clicking ON the picture that's on this demo page. Click that' page's button only puts you in fullscreen mode without enlarging the picture. Click the image and it image will appear in fullscreen mode. In your code, you'd simply replace that image tag with your iframe code and give the iframe an ID value. You might also need to add an iframe class to the style sheet that sets the iframe's display value to block and give height and width CSS values of 100%. Note: To make this work, you'd have to click a thumbnail PHOTO of your model -- not the model itself. Clicking a model causes it to "play." In your HTML you could overlay a photo of the model (that you made via your Snipping Tool) and position that photo on top of the real model (or simply make the real model invisible initially.) When people clicked that photo, which looks like the modle, the code runs, hides the photo and reveals the actual model running in fullscreen mode. You could also display a button that makes a model appear in fullscreen when users click the button. However, I'm not sure why you don't just let users click the fullscreen icon that's already visible in a model's bottom-right corner. If you make your own fullscreen functionality, people may not be able to click the model's fullscreen icon to get out of fullscreen. They'd have to remember that the ESC key does that. If you're shooting for popup windows, remember that some users some may have popup blockers running. You also have the option of showing a slider people could use to gradually resize a model. It's even possible to give people the ability to drag a model with a mouse and resize it using a mouse. You'll have to do a little coding though but you'd have a bit of extra fun. |
||
| Post 6 • IP flag post | ||
Pages:
1This topic is archived. Start new topic?