Some text

Geek Answers Handbook

How to get iframe content width?

I got an iframe on my page. Like this:

<iframe width="600px"> <html> <head> </head> <body> <p>Some text</p> <img src="/foo/bar/test.png" /> </body> </html> </iframe>

I want to determine if the content of the iframe exceeds 600 pixels. I tried this:

 var iframe = $('iframe'); if (iframe.width() < iframe.contents().width()) { console.log('contents larger than the iframe'); }

It works on Firefox and Internet Explorer. But not in Chrome. In Chrome, iframe.contents().width() is 600.

I tried iframe.contents().find('body').width() , but the result is also 600.

How can I determine the actual width of the iframe content in Chrome?

+4
source share
3 answers

I assume you want to get the width of the iframe timymce iframe. You can try this piece of code. What else needs to be done is to set the carriage to the outer right position. The idea is to measure the location of the carriage.

 var ed = tinymce.editors[0]; // or tinymce.get('your_editor_id') var rng = ed.selection.getRng(); rng.collapse(true); var bm = ed.selection.getBookmark(); var $marker = $(ed.getBody()).find('#'+bm.id); var elem = ed.getDoc().getElementById(bm.id+'_start'); try { box = elem.getBoundingClientRect(); } catch(e) { console.log('adjustIframePosition (irbasics) error creating box: ' + e); } var doc = ed.getDoc(), docElem = doc.documentElement, body = ed.getBody(), win = ed.getWin(), clientTop = docElem.clientTop || body.clientTop || 0, clientLeft = docElem.clientLeft || body.clientLeft || 0, scrollTop = win.pageYOffset || jQuery.support.boxModel && docElem.scrollTop || body.scrollTop, scrollLeft = win.pageXOffset || jQuery.support.boxModel && docElem.scrollLeft || body.scrollLeft, top = box.top + scrollTop - clientTop, left = box.left + scrollLeft - clientLeft; console.log('iframe width: ' + (box.left + scrollLeft) );
0
source

Try adding width check after loading iframe as suggested here

he helped.

0
source

I do not use jQuery, but maybe I can help:

 var iframe = document.getElementById("myiframe"); var doc = iframe.contentDocument || iframe.contentWindow.document; alert(doc.body.scrollWidth); // use this property for check
-1
source

More articles:


All Articles