Controlling MARQUEE Object Properties

Controlling MARQUEE Object Properties : Marquee : HTML JAVASCRIPT DHTML TUTORIALS

JAVASCRIPT DHTML TUTORIALS » HTML » Marquee »

Controlling MARQUEE Object Properties



/*
JavaScript Bible, Fourth Edition
by Danny Goodman 

Publisher: John Wiley & Sons CopyRight 2001
ISBN: 0764533428
*/


<HTML>
<HEAD>
<TITLE>MARQUEE Object Properties</TITLE>
<SCRIPT LANGUAGE="JavaScript">
// one function does all!
function setMARQUEEAttr(select) {
    if (document.all && document.all.myMARQUEE) {
        var choice = select.options[select.selectedIndex].value
        if (choice) {
            document.all.myMARQUEE.setAttribute(select.name, choice)
        }
    }
}
</SCRIPT>
</HEAD>
<BODY>
<H1>MARQUEE Object Properties</H1>
<BR>
<HR>
<MARQUEE ID="myMARQUEE" WIDTH=400 HEIGHT=24>This is the MARQUEE element object
 you will be controlling.</MARQUEE>
<FORM>
<INPUT TYPE="button" VALUE="Start Marquee" onClick="document.all.myMARQUEE.start()">
<INPUT TYPE="button" VALUE="Stop Marquee" onClick="document.all.myMARQUEE.stop()">
<BR>
Select a behavior: 
<SELECT NAME="behavior" onChange="setMARQUEEAttr(this)">
    <OPTION></OPTION>
    <OPTION VALUE="alternate">Alternate</OPTION>
    <OPTION VALUE="scroll">Scroll</OPTION>
    <OPTION VALUE="slide">Slide</OPTION>
</SELECT>
<BR>
Select a background color: 
<SELECT NAME="bgColor" onChange="setMARQUEEAttr(this)">
    <OPTION></OPTION>
    <OPTION VALUE="red">Red</OPTION>
    <OPTION VALUE="green">Green</OPTION>
    <OPTION VALUE="blue">Blue</OPTION>
    <OPTION VALUE="#FA8072">Some Hex Triplet Value</OPTION>
</SELECT>
<BR>
Select a scrolling direction: 
<SELECT NAME="direction" onChange="setMARQUEEAttr(this)">
    <OPTION></OPTION>
    <OPTION VALUE="left">Left</OPTION>
    <OPTION VALUE="right">Right</OPTION>
    <OPTION VALUE="up">Up</OPTION>
    <OPTION VALUE="down">Down</OPTION>
</SELECT>
<BR>
Select a scroll amount: 
<SELECT NAME="scrollAmount" onChange="setMARQUEEAttr(this)">
    <OPTION></OPTION>
    <OPTION VALUE=4>4</OPTION>
    <OPTION VALUE=6>6 (Default)</OPTION>
    <OPTION VALUE=10>10</OPTION>
</SELECT>
<BR>
Select a scroll delay: 
<SELECT NAME="scrollDelay" onChange="setMARQUEEAttr(this)">
    <OPTION></OPTION>
    <OPTION VALUE=50>Short</OPTION>
    <OPTION VALUE=85>Normal</OPTION>
    <OPTION VALUE=125>Long</OPTION>
</SELECT>
</BODY>
</HTML>