All geek questions in one place

Iframe with fixed width and height DYNAMIC

Is it possible to use an iframe with a fixed width (.exe 75%) and dynamic height ? I would like to ensure that when the page loaded in the iframe, it will not be wider than I indicated, but the length should be in accordance with the page of its contents. This is a page with 5-line text, the frame will be large enough to display these 5 lines. Whether we load a large document with 1000 lines, the height of the Iframe is automatically adjusted.

Prerequisites:

  • The URL in the frame is in a different domain from the parent.
  • The code should work with browsers for mobile phones.
  • Try avoiding jQuery if possible. (to make it faster)
+4
source share
2 answers

I know that you would like to avoid this, but it really should not bother you so much that it will be a burden on your site. I did much crazier things with jquery and he treated it like a champion. When you say “dynamic”, this is usually a safe bet that you will need to touch some javascript at some point: P

$(selector)[0].scrollHeight

How to make it dynamic? You can adjust the interval to adjust the height.

Something like that:

 function setHeight(selector){ var contentHeight = $(selector)[0].scrollHeight; $('#iframe-id').attr('height', contentHeight); }

Then you either upload it to the page load, or transfer it to setInterval.

If this is just a jquery thing and you are not against javascript, then this site can help you http://www.mattcutts.com/blog/iframe-height-scrollbar-example/

+2
source

The height of the IFrame can be controlled using page rendering code or JavaScript ... but there is no way to dynamically change the iframe based on the content.

The link in the mplungjan comment adds you a good entry about this topic.

0
source

Source: https://habr.com/ru/post/1344571/

More articles:


All Articles