This element handles functionality of <frame>/<iframe> elements - containers of sub-documents inside host document.
The behavior can be applied to any block element, <div> or <section> for example.
These elements have behavior:frame applied by default:
<frame> - block document container;<iframe> - inline block document container.In Sciter, <frame> is an ordinary DOM element that can appear in any context where other block elements can appear. Not only as a child of <frameset>.
<frame> element can have any arbitrary content initially. In this respect <frame> is not anyhow different from <div> or <section>.
<frame> <p>Select document to load</p> </frame>
After contect loading ( due to src attribute handling or .load() method call ) the frame will have single child element - root element of loaded document, <html> for example
The <frame> with loaded document:
<frame>
<html>
<head>...</head>
<body>...</body>
</html>
</form>
To access loaded document from script use frame[0] reference to get first child of the frame - child document root:
var frm = $(frame#main);
var childDoc = frm[0];
var someBtn = childDoc.$("button#some");
...
<frame> attributes that have special meaning:
src="url" - optional, URL of document to load in the frame;content-style="url" - optional, URL of .css file to be applied to the content. Useful when host document needs to apply some specific styles on top of styles defined in document itself.:busy - this flag is in on state during document loading. It can be used to style "document loading..." state.N/A
var frame = $(frame#some);
btn.onControlEvent = function(evt)
{
switch(evt.type) {
case Event.DOCUMENT_CREATED: /* evt.target is the document */ break;
case Event.DOCUMENT_COMPLETE: /* evt.target is the document */ break;
}
}
event complete $(frame#some) { ... event handling code ... }