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/

   

switcho() Function

The switcho() function makes switches through a series of text, links, or images. This can be used to make rotating ad banners or other items where you want items to dynamically switch themselves. This function can do three things

  1. if the tag that it refers to is an <a> tag, the function will switch its HREF,
  2. if the tag that it refers to is an <img>, the function will switch its SRC and create a blend transition between the old and new image,
  3. and if the tag is anything else, the function will switch its innerHTML property.

In the function switcho(x, t, c), x is the element that should be switched, t is the text that contains the different values for the switches, they should be seperated only by commas - no spaces, and c is the amount of time in milliseconds to wait between each switch.

For example, to rotate a set of links:

<a href="http://www.microsoft.com" id=lnk1><span id=txt1>Microsoft.Com</span></a>
<script>
function getgo() {
    // Swap the HREFs
    switcho(lnk1, "http://www.microsoft.com,http://www.realaudio.com,http://www.insidedhtml.com", 30);
    // Swap the Text
    switcho(txt1, "Microsoft.Com,RealAudio.Com,InsideDHTML", 30)
}
</script>;

The above can also be accomplished by:

<span id=txt2><a href="http://www.microsoft.com">Microsoft.Com</a></span>
<script>
function getgo() {
    switcho(txt2, '<a href="http://www.microsoft.com">Microsoft.Com</a>,<a href="http://www.realaudio.com">RealAudio.com</a>,<a href="http://www.insidedhtml.com">InsideDHTML</a>', 30);
}
</script>

Example

Microsoft.Com

switcho() Function

function switcho(x, t, c) {

        if (x.selNum == null) {
                x.texts = new Array();
                x.currText = "";
                x.currNum = 0;     
                x.selNum = 0;
                x.Len = 0;

                for (x.i = 0; x.i < t.length; x.i++) {
                        if (t.charAt(x.i) == ",") {
                                x.texts[x.currNum] = x.currText;
                                x.currText = "";
                                x.currNum++;
                                x.i++;
                        }
                        x.currText = x.currText + t.charAt(x.i);
                }
                x.texts[x.currNum] = x.currText;
                x.Len = x.currNum;
        }

        if (x.selNum < x.Len) {
                x.selNum = x.selNum + 1;
        } else {
                x.selNum = 0;
        }
                                       
        if (x.tagName == "A") {
                x.href = x.texts[x.selNum];
        } else if (x.tagName == "IMG") {
                if (x.style.filter = "") {
                        d = (c - 5) / 10;
                        if (d > 5) d = 5;
                        x.style.filter = "blendTrans(duration=" + d + ")";
                } else {
                        d = (c - 5) / 10;
                        if (d > 5) d = 5;
                        x.style.filter = x.style.filter + "blendTrans(duration=" + d + ")";
                }

                x.filters.blendTrans.Apply();
                x.src = x.texts[x.selNum];
                x.filters.blendTrans.Play();
        } else {
                x.innerHTML = x.texts[x.selNum];
        }

        ab1 = window.setTimeout("switcho(" + x.id + ",'" + t + "'," + c + ");", c * 100);
}