zoukankan      html  css  js  c++  java
  • 一些特效,不断更新

    凹陷文字

    <div style="300px;padding:20px;overflow:hidden;word-wrap:break-word;word-break:break:all; font-size:12px; line-height:18px; background-color:#eeeeee;">
    <font disabled>
    怎么样,我凹下去了吧?<br>
    你不想试试吗?<br>
    </font>
    </div> 

    ================

    SELECT项目美化


    <style>
    body, input
    {
     font-family: verdana;
     font-size: 9pt;
    }
    h1
    {
     font-family: tahoma;
     font-size: 22pt;
     text-align: left;
    }
    pre
    {
     font-size: 9pt;
     font-family: verdana;
     border: 1px solid #006600;
      400px;
     padding: 10px;
     background: #ffffff;
     color: #006600;
    }
    .CtlSelect
    {
     border: 1px solid #006600;
     font-family: verdana;
     height: 20px;
     color: #006600;
     background: #ffffff;
     /*background:url({E5066804-650D-4757-9BA4-A92DB8817A18}0.jpg);*/
    }
    .selected
    {
     background: #006600;
     color: #ffffff;
     height: 20px;
    }
    .unselected
    {
     height: 20px;
     color: #006600;
     line-height: 120%;
     border-bottom: 1px solid #006600;
    }
    .CtlSelect1
    {
     border: 1px solid #003399;
     font-family: verdana;
     height: 20px;
     color: #003399;
     background: #ffffff;
     /*background:url({E5066804-650D-4757-9BA4-A92DB8817A18}0.jpg);*/
    }
    .selected1
    {
     background: #003399;
     color: #ffffff;
     height: 20px;
    }
    .unselected1
    {
     height: 20px;
     color: #003399;
     line-height: 120%;
     border-bottom: 1px solid #003399;
    }
    .CtlSelect2
    {
     border: 1px solid #990000;
     font-family: verdana;
     height: 20px;
     color: #990000;
     background: #ffffff;
     /*background:url({E5066804-650D-4757-9BA4-A92DB8817A18}0.jpg);*/
    }
    .selected2
    {
     background: #990000;
     color: #ffffff;
     height: 20px;
    }
    .unselected2
    {
     height: 20px;
     color: #990000;
     line-height: 120%;
     border-bottom: 1px solid #990000;
    }
    .copyright
    {
     margin-top: 10px;
     font-size: 9pt;
     text-align: center;
     color: #333;
     font-weight: bold;
    }
    </style>
    </HEAD>

    <BODY>
    <SCRIPT LANGUAGE="JavaScript">
    <!--


    function $(objID)
    {
     return document.getElementById(objID);
    };
    function Offset(e)
    {
     var t = e.offsetTop;
     var l = e.offsetLeft;
     var w = e.offsetWidth;
     var h = e.offsetHeight-2;

     while(e=e.offsetParent)
     {
      t+=e.offsetTop;
      l+=e.offsetLeft;
     }
     return {
      top : t,
      left : l,
      width : w,
      height : h
     }
    }
    //-----------------------------------------------
    function simulateSelect() { with(this)
    {
     this.IDs = [];
     this.name = this;
     //  property for beta Version
     //  can editable combox
     this.readonly = true;
     this.height = 20;
     this.width = null;
     this.ctlStyle = "CtlSelect";
     this.selStyle = "selected";
     this.unselStyle = "unselected";
     this.elementPrefix = "e__";
     this.inputPrefix = "i__";
     this.containerPrefix = "c__";
     this.buttonPrefix = "b__";
     return this;
    }};
    simulateSelect.prototype.init = function(ctlSelIDs) { with(this)
    {
     eval(name).append(ctlSelIDs);
     eval(name).simulates();
    }};

    simulateSelect.prototype.style = function() { with(this)
    {
     ctlStyle = arguments[0];
     selStyle = arguments[1];
     unselStyle = arguments[2];

    }};
    //-----------------------------------------------
    simulateSelect.prototype.append = function(ctlSelIDs) { with(this)
    {
     if( ctlSelIDs.indexOf(",")>0 )
     {
      var arrCtlSel = ctlSelIDs.split(",");
      for(var i=0; i<arrCtlSel.length; i++)
      {
       eval(name).IDs.push(arrCtlSel[i]);
      }
     }
     else
     {
      eval(name).IDs.push(ctlSelIDs);
     }
    }};
    simulateSelect.prototype.checkupOnMouseDown = function(e) { with(this)
    {
     // here compatible mf.
     var el = e ? e.srcElement : e.target;
     if( el.id.indexOf(elementPrefix)>-1 ||
     el.id.indexOf(inputPrefix)>-1 ||
     el.id.indexOf(containerPrefix)>-1 ||
     el.id.indexOf(buttonPrefix)>-1 )
     {
      return;
     }
     else
     {
      for(var i=0; i<eval(name).IDs.length; i++)
      if( $(containerPrefix + IDs[i]) )
      $(containerPrefix + eval(name).IDs[i]).style.display = "none";
     }

    }};
    simulateSelect.prototype.simulates = function() { with(this)
    {
     for(var i=0; i<IDs.length; i++)
     eval(name).simulate(IDs[i]);
    }};
    simulateSelect.prototype.simulate = function(ctlSelID) { with (this)
    {
     var input;
     var button;
     var object;
     var offset;

     object = $(ctlSelID);
     offset = Offset(object);
     input = document.createElement("INPUT");
     button = document.createElement("BUTTON");
     button.setAttribute("id", buttonPrefix + ctlSelID);
     //button.value = "⊿";
     button.value = "6";
     button.style.fontFamily = "Webdings, Marlett";
     button.style.background = "";
     button.onclick = input.onclick = function()
     {
      this.blur();
      eval(name).expand(ctlSelID, offset);
     }
     input.onselectstart = function() { eval(name).expand(ctlSelID, offset); event.returnValue = false; };
     input.setAttribute("id", inputPrefix + ctlSelID);
     input.title = button.title = "click expand options";
     input.style.cursor = button.style.cursor = "default";
     input.className = button.className = ctlStyle;
     input.style.width = (width>0 ? width : object.offsetWidth);
     height ? input.style.height=button.style.height=height : "";
     input.value = object[0].text;
     if( readonly==true ) input.readOnly=true;

     // this method is only IE.
     object.insertAdjacentElement("afterEnd",button);
     object.insertAdjacentElement("afterEnd",input);
     object.style.display = 'none';
    }};
    simulateSelect.prototype.expand = function(ctlSelID, offset) { with(this)
    {
     var div, btn_off;
     var object = $(ctlSelID);

     if( !$(containerPrefix + ctlSelID) )
     {
      div = document.createElement("DIV");
      div.style.position = "absolute";
      div.style.display = "block";
      div.setAttribute("id", containerPrefix + ctlSelID);
      div.className = ctlStyle;
      div.style.left = offset.left;
      div.style.top = offset.top + offset.height;
      div.style.width = (width ? width : offset.width) + 20;
      div.style.height = offset.height;
      document.body.appendChild(div);

      for(var i=0; i<object.length; i++)
      {
       div = document.createElement("DIV");
       div.setAttribute("id", div.id = elementPrefix + ctlSelID + i);
       div.style.cursor = "default";

       if( object[i].text==$(inputPrefix + ctlSelID).value )
       div.className = selStyle;
       else
       div.className = unselStyle;

       div.innerText = div.title = object[i].text;
       div.style.height = height;
       div.setAttribute("value", object[i].value);

       div.onmouseover = function()
       {
        for(var j=0; j<$(containerPrefix + ctlSelID).childNodes.length; j++)
        {
         if($(containerPrefix + ctlSelID).childNodes[j]==this)
         $(containerPrefix + ctlSelID).childNodes[j].className = selStyle;
         else
         $(containerPrefix + ctlSelID).childNodes[j].className = unselStyle;
        }      
       };
       div.onclick = function()
       {
        $(inputPrefix + ctlSelID).value = this.innerText;
        $(containerPrefix + ctlSelID).style.display = "none";
       };
       $(containerPrefix + ctlSelID).appendChild(div);
      }
      return;
     }

     if( $(containerPrefix + ctlSelID).style.display=="none" )
     {
      for(var i=0; i<object.length; i++)
      {
       if( object[i].text==$(inputPrefix + ctlSelID).value )
       $(elementPrefix + ctlSelID + i).className = selStyle;
       else
       $(elementPrefix + ctlSelID + i).className = unselStyle;
      }
      $(containerPrefix + ctlSelID).style.display="block";
      return;
     }

     if( $(containerPrefix + ctlSelID).style.display=="block" )
     {
      $(containerPrefix + ctlSelID).style.display="none";
      return;
     }
    }};
    simulateSelect.prototype.getValue = function(ctlSelID) { with(this)
    {
     if( $(inputPrefix + ctlSelID) )
     return $(inputPrefix + ctlSelID).value;
     else
     return null;
    }};
    simulateSelect.prototype.addEvent = function(w, h) { with(this)
    {
    }};
    //-----------------------------------------------
    //window.onerror = Function("return true;");
    //  IE only.
    document.attachEvent("onmousedown", function() {
          a.checkupOnMouseDown(event);
          b.checkupOnMouseDown(event);
          c.checkupOnMouseDown(event)
          }
         );
    //-->
    </SCRIPT>
    <h1> simulate combox control </h1>
    <h4> demonstrate </h4>

    <p>
    <select id="s0">
    <option value="- please select your options -"> - please select your options -</option>
    <option value="1">option1</option>
    <option value="2">option2</option>
    <option value="3">option3</option>
    <option value="4">option4</option>
    <option value="5">option5</option>
    </select>
    </p>

    <p>
    <select id="s1">
    <option value="- please select your options -"> - please select your options -</option>
    <option value="1">1option1</option>
    <option value="2">1option2</option>
    <option value="3">1option3</option>
    <option value="4">1option4</option>
    <option value="5">1option5</option>
    </select>
    </p>

    <p>
    <select id="s2">
    <option value="- please select your options -"> - please select your options -</option>
    <option value="1">2option1</option>
    <option value="2">2option2</option>
    <option value="3">2option3</option>
    <option value="4">2option4</option>
    <option value="5">2option5</option>
    </select>
    </p>

    <p>
    <select id="s3">
    <option value="- please select your options -"> - please select your options -</option>
    <option value="1">3option1</option>
    <option value="2">3option2</option>
    <option value="3">3option3</option>
    <option value="4">3option4</option>
    <option value="5">3option5</option>
    </select>
    </p>

    <button onClick="alert(a.getValue('s1') + '/n/n' + b.getValue('s2'))" class="CtlSelect"> Get value </button>

    <SCRIPT LANGUAGE="JavaScript">
    <!--
     var a = new simulateSelect();
     a.style("CtlSelect", "selected", "unselected");
     a.init("s1");
     var b = new simulateSelect();
     b.style("CtlSelect1", "selected1", "unselected1");
     b.width = 300;
     b.init("s2");
     var c = new simulateSelect();
     c.style("CtlSelect2", "selected2", "unselected2");
     c.width = 320;
     c.init("s3");
    //-->
    </SCRIPT>

    <h4> description </h4>


    <div class="copyright">
    Power By blueDestiny, never-online

    </div>
    </BODY>
    </HTML>

    =======================

    三行四列的写法
    <%
    n=0
    for i=0 to12
    if n mod 4=0 then'这里要几列就mod几等于0就行了
    %>
    <tr><%end if
    n=n+1
    %><td></td><td></td><td></td><td></td><%if if n mod 4=0 then%></tr><%end if%>
    <%next%>

    ================

  • 相关阅读:
    Educational Codeforces Round 20 D. Magazine Ad
    Educational Codeforces Round 20 C. Maximal GCD
    紫书第三章训练2 暴力集
    Educational Codeforces Round 20 B. Distances to Zero
    Educational Codeforces Round 20 A. Maximal Binary Matrix
    紫书第三章训练1 D
    紫书第一章训练1 D -Message Decoding
    HAZU校赛 Problem K: Deadline
    Mutual Training for Wannafly Union #8 D
    紫书第三章训练1 E
  • 原文地址:https://www.cnblogs.com/zerogo/p/2209356.html
Copyright © 2011-2022 走看看