📄 djs.htm

📁 网页颜色渐变,可实现网页中背景色的渐变效果
💻 HTM
字号:
<html>
  <head>
    <title>  css djs </title>
    <script defer>
       function initializepage()
       {
        buildcolortable();
       }
    </script>
  </head>

  <body onload="initializepage()">
     <div id ="div1"
          style="position:absolute;top:20;left:20;
                width:100;height:100;font-size:100;text-align:center;
                background-color:red;
                filter:revealtrans(transition=23,duration=.01)"
                onclick="count()"
                onfilterchange="repeat()">
    </div>
    <div style="position:absolute;top:130;left:20">
      <dd><br>
          单击这个方块看看让你吃惊的效果
      </dd>
    </div>

    <p> <br>
    <script>
       <!--
         var imaxtransition=23;
         var itransnumber=imaxtransition;
         var speed=2.5;
         var frunning=0;
         var speeddirection=0;
         var g_acolors= new initarray(24);

         function initArray() {
      this.length = initArray.arguments.length
      for (var i = 0; i &lt; this.length; i++)
      this[i+1] = initArray.arguments[i]
   }

         function colorpair(scolor,sbgcolor)
         {
          this.m_color=scolor;
          this.m_bgcolor=sbgcolor;
         }
    
         function buildcolortable()
         {
          g_acolors[0]=new colorpair('#000000','#ffffff');
          g_acolors[1]=new colorpair('#305b60','#1174c0');
          g_acolors[2]=new colorpair('#033450','#10a9a0');
          g_acolors[3]=new colorpair('#030d40','#0fde80');
          g_acolors[4]=new colorpair('#02e630','#0f1360');
          g_acolors[5]=new colorpair('#02bf20','#0e4840');
          g_acolors[6]=new colorpair('#029810','#0d7d20');
          g_acolors[7]=new colorpair('#027100','#0cb200');
          g_acolors[8]=new colorpair('#0249f0','#0be6e0');
          g_acolors[9]=new colorpair('#0222e0','#ff0000');
          g_acolors[10]=new colorpair('#01fbd0','#0a50a0');
          g_acolors[11]=new colorpair('#01d4c0','#098580');
          g_acolors[12]=new colorpair('#01adb0','#08ba60');
          g_acolors[13]=new colorpair('#0186a0','#07ef40');
          g_acolors[14]=new colorpair('#015f90','#072420');
          g_acolors[15]=new colorpair('#013880','#065900');
          g_acolors[16]=new colorpair('#011170','#058de0');
          g_acolors[17]=new colorpair('#00ea60','#04c2c0');
          g_acolors[18]=new colorpair('#00c350','#03f7a0');
          g_acolors[19]=new colorpair('#009c40','#032c80');
          g_acolors[20]=new colorpair('#007530','#026160');
          g_acolors[21]=new colorpair('#004e20','#019640');
          g_acolors[22]=new colorpair('#002710','#00cb20');
          g_acolors[23]=new colorpair('#038270','#123fe0');
         }
 
         function repeat()
         {
           frunning=0;
           count();
         }
 
         function count()
         {
          if (frunning==0)
          {
           frunning=1;
           div1.filters[0].transition=itransnumber;
           div1.filters[0].apply();
           div1.innertext=itransnumber;
           if (itransnumber<=g_acolors.length)
           {
             div1.style.backgroundcolor=g_acolors[itransnumber].m_bgcolor;
                  div1.style.color=g_acolors[itransnumber].m_color;
           }

           div1.filters[0].play(speed);

           if (itransnumber==0)
           {
              itransnumber=imaxtransition;
              return;
           }
           itransnumber--;

           if (speed>.1)
           {
             speed=0.1;
           }
          }
         }
     -->
        </script>
         </p>
        </body>
        </html>
⌨️ 快捷键说明

复制代码 Ctrl + C
搜索代码 Ctrl + F
全屏模式 F11
切换主题 Ctrl + Shift + D
显示快捷键 ?
增大字号 Ctrl + =
减小字号 Ctrl + -