CODEWITHSUNDEEP
javascriptiframe
user1177860
user1177860

Reputation: 509

How do you create auto resizing a iframe when you make your browser smaller?

Does anyone know of a way to auto resize an iframe when you make your browser smaller??

Upvotes: 0

Views: 3370

Answers (5)

pseudosavant
pseudosavant

Reputation: 7244

You can also do this without JavaScript if you'd like using CSS Media Queries. See this example here:

http://ie.microsoft.com/testdrive/HTML5/CSS3MediaQueries/Default.html

They are often used for "responsive design".

Upvotes: 0

Frankline
Frankline

Reputation: 41025

You could as well use this.

Basically it makes use of callResize() in Child page and resizeIframe() in Parent page.

Upvotes: 0

Christofer Eliasson
Christofer Eliasson

Reputation: 33865

Haven't tried it but I guess you could use a percentage width instead of a fixed width. In that case you should probably add a minimum width and height as well, to avoid that it is getting too small:

iframe
{
   width: 50%;
   height: 50%;
   min-width: 300px;
   min-height: 300px;
}

Upvotes: 0

Alexander Pavlov
Alexander Pavlov

Reputation: 32296

One option is to specify the <iframe> size in percent.

Upvotes: 0

moribvndvs
moribvndvs

Reputation: 42497

You can attach a handler to the window.onresize event, and then resize your IFRAME appropriately.

I prefer jQuery:

$(window).resize(function() {
  $('IFRAME').width($(window).width());

});

Upvotes: 1

Related Questions