www.insideDHTML.com
Inside Dynamic HTML | Fun and Games | The 10K Demo | XML Online | CSS Online | Resources
Write Once! | DHTML Toolkits | Inside Techniques | Inside Scriptlets

Inside Techniques/

   

fadeo() Function

The fadeo() function makes an element appear to fade into view.

To use this function, you must define a HTML DIV, SPAN, TABLE, TD, TH, or IMG element with an unique HTML ID and CSS filter, and visibility attribute. For the DIV and SPAN element a width is also required. For example, the following defines a DIV that we will fade into view.

<DIV id=demo STYLE="width: 100%; text-align: center; filter: blendTrans(duration=10); visibility: hidden">
  <H1 STYLE="color: navy">Inside Dynamic HTML</H1>
</DIV>

The filter: blendTrans(duration=10) defines that the element will blend into the page. The blend begins when the fadeo() function is called. The duration specifies how long the blend will take to complete.

When you call the fadeo(i) function, i is the element to fade into view. While the element is coming into view, any subsequent calls to fadeo() are ignored. The following function call brings the DIV defined above into view: fadeo(demo).

In non-IE4 browsers, the string is displayed and does not fade into view

fadeo() Function

function fadeo(x) {   
    if (x.filters.blendTrans.status==0) {
        x.filters.blendTrans.Apply();
        x.style.visibility = "visible";
        x.filters.blendTrans.Play();
    }
}