Shamoon
Shamoon

Reputation: 43609

How can I cleanly resize an iFrame with dragging functionality?

I have an iFrame and I want the user to be able to grab one side of it and drag it to resize it. I don't want it to resize realtime, but rather use an indicator line and when the user releases, it'll resize.

I'm using jQuery.

Any help?

Upvotes: 4

Views: 8394

Answers (4)

Sebastián Grignoli
Sebastián Grignoli

Reputation: 33462

As of 2020 you can simply add the CSS property resize: both or resize: vertical to the iframe element.

Upvotes: 7

Shamoon
Shamoon

Reputation: 43609

http://jqueryui.com/demos/resizable/#visual-feedback

That seems to do the trick with an iFrame inside a DIV

Upvotes: 0

Matthew Nessworthy
Matthew Nessworthy

Reputation: 1428

jQuery Resizable with an indicator as to the eventual dimensions as per your request. See Russ C's comment and link to a better solution

Upvotes: 0

Russ Clarke
Russ Clarke

Reputation: 17909

Iirc, the classical method is to put the IFrame inside of a div and make that div re-sizable; also make the iFrame's width and height at 100%.

If you're using JQuery though, can you not use jQuery.load('uri') instead of an iFrame ? I believe it's preferable in many situations.

Upvotes: 6

Related Questions