[whatwg] Disabled attribute for iframes

Greg Houston gregory.houston at gmail.com
Thu Aug 14 14:45:11 PDT 2008

I would like to propose a disabled attribute for iframes.

Disabled would make the iframe read-only, i.e., you cannot highlight
text, click on forms, or scroll the iframe content.

I don't know what the correct terminology is for the behavior that
happens when you mouseover an iframe, but basically you shift context
from the parent page to the iframe.

This shift in context can cause problems in at least a couple
situations with web applications.

1. You have a fluid layout where the columns are resizable via
javascript by dragging the borders. The content of one of the columns
is an iframe. You begin dragging the border between it and the column
to the left, but as soon as the cursor goes over the iframe, the
dragging functionality stops because you have now entered the context
of the iframe. Thus it becomes impossible or at the very least very
difficult to resize the column containing it.

2. This case is very similar. Say you have the same fluid layout as
above with the middle column being an iframe. Above that you have a
DHTML popup dialog window that can be resized and moved (both via
drag). Trying to resize such a dialog window becomes very difficult
since as soon as the cursor leaves the bounds of the dialog window and
over the iframe everything stops. You just shifted context to the

A workaround for the first issue is to hide the visibility of all
iframes on the page when you start dragging, but it would be nicer if
you could still see the iframes and just toggle their disabled
attribute at the beginning and end of a drag.

A workaround for the second issue is to create a transparent overlay
(such as used with modals, but transparent) beneath the DHTML dialog
window whenever it is being dragged or resized, and thus cover any
iframes on the page. This solution doesn't work for the first issue
however and it involves a lot extra markup, code, and tricky css to
get the overlay to cover the entire viewable area of the page.

Note this will probably be an issue with the new drag and drop
functionality in HTML5. Say you have an element on the left side of
the page. There is an iframe in the middle of the page. You try to
drag the element to the right side of the page. Once you get over the
iframe your dragging is most likely going to stop right in its tracks
because you just left the parent document and entered the context of
the iframe. The iframe could be 10px by 10px in size, but as soon as
your cursor goes over it dragging stops.

There may be smarter solutions for this, though perhaps more complex
for the user agents. To drag something you must have your mouse button
down. So if you pass over an iframe while a mouse button is down don't
shift context to the iframe, not until the mouse button has been
released. This would probably fix most drag and drop and resize issues
with iframes.

- Greg

More information about the whatwg mailing list