Target all iframes on the scene within HTML widgets

Hi just wondering if anyone can point me in the right direction please?

Have multiple HTML widgets with iframes containing Vimeo embeds
Need to target the iframes and pause the videos when not being viewed

I know that the HTML widgets are iframes also so it's an iframe within an iframe. Heres my code so far!

Problem with this line of code ???

var sceneElement = hypeDocument.getElementById(hypeDocument.currentSceneId());
var allIframesOnScene = sceneElement.getElementsByTagName("iframe");

// loop over each
for(var i = 0; i < allIframesOnScene.length; i++) {
	// filter out anything without in the src
	if(allIframesOnScene[i].src == null || allIframesOnScene[i].src.indexOf("") == -1) {
	// we have a vimeo iframe
	var iframe = allIframesOnScene[i];
	var player = $f(iframe);

Does anyone know what the TagName is for the HTML Widget in hype? This might help solve the issue.

Many thanks.

Why are you doing this iFrame inception to begin with? Best to keep a solution as simple as possible! I would probably just write a function that populates rectangles with a Vimeo embed or empties it out / pause it.

1 Like

The rectangle element is automatically adding ="" after the data-vimeo-defer attribute in the iframe otherwise I would use the rectangle element!

Hmmm, it should be okay that the attribute has an empty value, since that is functionally equivalent. Do you find this causes a particular problem? (feel free to post a sample doc and I'd be interested to see).