js实现滚动效果

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

    <title></title>

</head>

<body>

    <form id="form1" runat="server">

    <table border="0" cellpadding="0" cellspacing="0">

        <tr>

            <td width="1" rowspan="2">

            </td>

            <td width="1" height="1">

            </td>

            <td height="1" bgcolor="#cccccc">

            </td>

            <td width="1">

            </td>

            <td width="1" rowspan="2">

            </td>

        </tr>

        <tr>

            <td width="1" height="1" bgcolor="#cccccc">

            </td>

            <td height="1">

            </td>

            <td width="1" bgcolor="#cccccc">

            </td>

        </tr>

        <tr>

            <td width="1" bgcolor="#cccccc">

            </td>

            <td width="1" height="1">

            </td>

            <td width="120" height="0">

                <marquee direction="right" scrollamount="10">

                    <table id="marq" style="font-size:1px;width:50px;height:10px;">

                    <tr>

                        <td></td>

                        <td></td>

                        <td></td>

                        <td></td>

                        <td></td>

                     </tr>

                    </table>

                </marquee>

            </td>

            <td width="1" height="1">

            </td>

            <td width="1" bgcolor="#cccccc">

            </td>

        </tr>

        <tr>

            <td rowspan="2">

            </td>

            <td height="1" bgcolor="#cccccc">

            </td>

            <td height="1">

            </td>

            <td bgcolor="#cccccc">

            </td>

            <td rowspan="2">

            </td>

        </tr>

        <tr>

            <td height="1">

            </td>

            <td height="1" bgcolor="#cccccc">

            </td>

            <td>

            </td>

        </tr>

    </table>

 

    <script language="jscript" type="text/jscript">

        var lightRGB = new Array(255, 255, 255);

        initColor("#D70010");

        function initColor(Color)

        {

            var opArray = new Array(.10, .25, .50, .75, 1.0);

            var baseColor = longHexToDec(Color.substring(1, 7));

            var nColor, nHex;

            for (var i = 0; i < 5; i++)

            {

                nColor = setColorHue(baseColor, opArray[i], lightRGB);

                nHex = toHex(nColor[0]) + toHex(nColor[1]) + toHex(nColor[2]);

                document.getElementById("marq").firstChild.firstChild.children(i).bgColor = "#" + nHex;

            }

        }

        function setColorHue(originColor, opacityPercent, maskRGB)

        {

            returnColor = new Array();

            for (w = 0; w < originColor.length; w++) returnColor[w] = Math.round(originColor[w] * opacityPercent) + Math.round(maskRGB[w] * (1.0 - opacityPercent));

            return returnColor;

        }

        function longHexToDec(longHex)

        {

            r = toDec(longHex.substring(0, 2));

            g = toDec(longHex.substring(2, 4));

            b = toDec(longHex.substring(4, 6));

            return new Array(r, g, b);

        }

        function toHex(dec)

        {

            hex = dec.toString(16);

            if (hex.length == 1) hex = "0" + hex;

            if (hex == 100) hex = "FF";

            return hex.toUpperCase();

        }

        function toDec(hex)

        {

            return parseInt(hex, 16);

        } 

    </script>

 

    </form>

</body>

</html>

posted @ 2009-10-24 17:19  小巩  阅读(175)  评论(0)    收藏  举报