Has anyboy already build a template that can allow an IFrame to go Fullscreen

#1

…like the single Tiddler fullscreen button?

#2

Can you give it a widget of 100% then make the tiddler it is in full screen?

#3

Hi @TW_Tones This does not work for the height AFAIK

#4

Was meant to say width, Yes I know height is questionable because many sites are of indeterminate length. There are however overflow options that can be used so beyond a set hight you need to use scrollbars.

However if you use open in new window button you can then maximise it to get an almost full screen.

Also I am no CSS expert, they can help but good units to use are vh and vw percentages vw100 - viewhight and viewwidth

#5

@JanJo, FWIW, I’ve been able to work with 100% width on iframes, but have not had any success with vh values, nor 100% height. I’ll stay tuned, as I’d love such a solution, especially if it does not involve making the url obviously visible. (Within a university LMS, I like to embed an iframe without giving students the idea of visiting the tiddlyhost url separately, since the LMS passes variables to the iframe (as permalink hash), and these variables modify what each student sees.)

#6

I have been playing around with fullscreen iframe’s for an upgrade mechanism for my wikifarm setup recently. I am not sure how you want to trigger the fullscreen display for an iframe but the CSS is relatively simple:

.my-iframe {
   position: fixed;
   top: 0;
   left: 0;
   width: 100vw;
   height: 100vh;
   z-index: 1201;
}

Additionally you can set overflow:hidden on .tc-body when an iframe is fullscreen to hide the scrollbars.

1 Like