Rendering and Visibility Considerations
You may have noticed while working through the examples in this chapter that you usually see the layout occur as the page loads; for example, you might see ordinary text HTML representing some of the layout content, and then all of a sudden it magically transforms into this great-looking layout. While not totally unacceptable, you will probably not want to see the rendering take place in many situations.
A common technique for working around the situation is to
initially set the body of the page to be hidden, and then when the
page finishes loading, make it visible all at one time. Accomplishing
this technique is quite simple, and you merely have to provide a style
(or class) indicating that the body of the page should be hidden, like
so: <body
style="visibility:hidden;"> should do the trick. Just
remember to add the corresponding call to make it visible at the
desired time. Assuming you've made the entire body hidden, adding a
dojo.style(dojo.body( ), "visibility",
"visible") to a dojo.addOnLoad displays the page's content.
Any callback could be used in place of page load if for some reason
you wanted to delay showing the page until some arbitrary event
occurred (like an asynchronous callback that provides data for a
custom widget, perhaps).
Tip
Recall that the difference between the CSS styles of
visibility and display has to do with taking up space on the screen.
In general, nodes styled with visibility:hidden are hidden from display but still ...
Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
and much more.
Read now
Unlock full access