Disable-rendering

From Frontal Wiki

Purpose

This style removes a visual element from the Frontal rendering process.

Value

Either "true" or "false". The default is "false".

disable-rendering: true;

Remarks

Normally, Frontal renders visual elements as their styles change or as their neighbors' styles change (thus affecting the layout). In some circumstances though this is undesirable for example when some other rendering process is in control. When might this be? Perhaps a visual element is being tweened via some tweening package or is being dragged via the Flash method startDrag. In either case, allowing Frontal to render that element would likely lead to some conflict. In those cases then, setting disable-rendering to true can avoid any conflicts.

The disable-rendering style is part of a triumvirate of styles along with visibility and display that control whether a visual element is in the Flash display list, the Frontal rendering list, neither or both.

When an element has display set to "none" then in it is removed from the Flash display list (and so not visible) and it is removed from the Frontal rendering list (and so its placement and dimensions do not have any effect on any other Frontal elements).

When an element has display set to "block" then the other two styles mentioned come into play independent of one another:

• Set visibility to "visible" to add the element to the Flash display list and set

it to "hidden" to remove it.

• Set disable-rendering to "false" to add the element to the Frontal rendering list and set

it to "true" to remove it.

Example

Drag and drop the red squares. As another red square is clicked, the previous one (which is now back in the rendering process) is returned to its correct layout position.

<style><![CDATA[
    .square
        {
			float: left;
			width: 30px;
			height: 30px;
			margin: 4px;
			background-color: red;
            @onMouseDown
                {
                    sS ( "disable-rendering", true );
                    movie.startDrag ( );
                }
            @onMouseUpAnywhere
                {
                    movie.stopDrag ( );
                    sS ( "disable-rendering", false );
                }
        }
]]></style>
<div class="square" />
<div class="square" />
<div class="square" />
<div class="square" />
<div class="square" />
<div class="square" />

See Also

• display
• visibility

Can Be Applied To

This style can be applied to any visual element:

• div
• document
• img
• text
• video
• form
• input