html和js結合打印出來漸變字

原創

Echo_Wei1991

2020-02-20 17:52

<!DOCTYPE html>
<html>

<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <script language="JavaScript">
        function Delta(sHex1,sHex2,iNum)
        {
            //alert("terminated!");
            var iHex1=parseInt("0x"+sHex1);
            var iHex2=parseInt("0x"+sHex2);
            return (iHex2-iHex1)/(iNum-1);
        }
        function colorful(sText,sColor1,sColor2)
        {
            if(sText.length<=1)
            {
                document.write("<p style='color: #"+sColor1+";'>"+sText+"</p>");
                return;
            }

            var fDeltaR = Delta(sColor1.substring(0,2),sColor2.substring(0,2),sText.length);
            var fDeltaG = Delta(sColor1.substring(2,4),sColor2.substring(2,4),sText.length);
            var fDeltaB = Delta(sColor1.substring(4,6),sColor2.substring(4,6),sText.length);

            var sColorR = parseInt("0x"+sColor1.substring(0,2));
            var sColorG = parseInt("0x"+sColor1.substring(2,4));
            var sColorB = parseInt("0x"+sColor1.substring(4,6));

            for(var i=0;i<sText.length;i++)
            {
                document.write("<span style='color:rgb("+Math.round(sColorR)+","+Math.round(sColorG)+","+Math.round(sColorB)+");'>"+sText.substring(i,i+1)+"</span>");
                sColorR+=fDeltaR;
                sColorG+=fDeltaG;
                sColorB+=fDeltaB;
            }
            return;


        }
    </script>
</head>

<body>

<script language="javascript">
    //alert("45yhgf");
    //var sText = ;

    colorful("要想心情好，頓頓要吃飽", "FF3300","3366FF");

    document.write("<p>ninininimei</p>");
    document.write(3>2 && 4>3);
</script>

<p style="color: rgb(13,14,15)">hytr</span></p>

</body>
</html>