• 使用css的expression方法的例子

    2005-10-19

    使用CSS里的expression方法，可以在CSS中写JS脚本，例子如下：
    -----------------------------1----------------------------
    <style type="text/css">

    #t {   /*这里使用对象ID来通配样式, 也可以定义一个css函数*/
      star:expression (
        onmouseover = function(){
            this.style.backgroundColor="#000";
            this.style.color="#fff";
        }    ,
        onmouseout = function(){
            this.style.backgroundColor="#fff";
            this.style.color="red";
        }
      )
    }
     
    </style>


    <input id="t" type="submit" name="Submit" value="提交">
    ---------------------------------------------------------

    改变只读文本框的背景颜色：

    --------------------------2-------------------------------
    <style>
    input{background-color:expression((this.readOnly && this.readOnly==true)?"#f0f0f0":"")}
    </style>
    <input type="text" NAME="">
    <input type="text" NAME="" readonly>
    <input type="text" NAME="">
    <input type="text" NAME="" readonly>
    ---------------------------------------------------------

    问题说明: 用过css样式我们就知道, 可以定义一批对象的class属性来指定同一个样式来统一界面. 但如何统一同类型的对象的事件? 比如:界面有无数个 <img src="**.jpg"> 如何实现鼠标经过此图片, 图片的src变成是**_over.jpg?

    --------------------------3-------------------------------
    　　/*替换图片CSS*/
    #imgScript {　 /*这里使用对象ID来通配样式, 也可以定义一个css函数　　*/
    　　star:expression(
    　　onmouseover = function()
      {
    /*替换图片*/
    　if(this.hover != null){
    　　　this.name = this.src;
    　　　this.src = this.src.replace('.jpg', '_over.jpg');
    　　　this.HasChg = 1;
    　}
      },
     onmouseout = function()
       {　
        /*还原本来的图片*/
    　 if(this.HasChg != null){
    　　　this.src = this.name;
    　　　this.HasChg = null;
    　}
      }
    )
    }/*end imgScript*/

    应用样式的img:
    <img src="a.jpg">
    ---------------------------------------------------------

    Tag：CSS 代码分享
    Ghost 发表于18:32 | 阅读全文 | 评论 0 | 编辑 | 推荐

  • 全国邮编地址与长途区号XML文档

    2005-10-14

    全国邮编地址与长途区号XML文档
    Tag：代码分享
    Ghost 发表于15:26 | 阅读全文 | 评论 0 | 编辑 | 推荐

  • MD5代码

    2005-10-14

    MD5代码（ASP版）下载

    MD5代码（JS版）下载

    Tag：代码分享
    Ghost 发表于15:11 | 阅读全文 | 评论 0 | 编辑 | 推荐

  • [原] 仿Office 2003的工具条

    2005-09-13

    看到网上有篇《仿Office 2003的工具条》，于是自己也简单的做了一个。
    借鉴了文章里对<input>鼠标事件的处理方法。
    -------------------------------源码-----------------------------------------
    <style type="text/css">
    <!--
    .lostfocus {
       background-color: #FFFFFF;
       border: 1px #FFFFFF solid;
       font: 12px Arial;
       vertical-align: baseline;
    }

    .getfocus {
       background-color: #FFFFFF;
       border: 1px #08246B solid;
       font: 12px Arial;
       vertical-align: baseline;
    }

    .leftitem {
       cursor: hand;
       padding: 0 2px 0;
       text-align: center;
       vertical-align: baseline;
       width: 30px;
    }

    .leftitemover {
       background-color: #C2D5F8;
       border: 1px #6495ED solid;
       cursor: hand;
       padding: 0 2px 0;
       text-align: center;
       vertical-align: middle;
       width: 30px;
    }

    .leftitemdown{
       background-color: #E4EDFC;
       border: 1px #6495ED solid;
       cursor: hand;
       padding: 0 2px 0;
       text-align: center;
       width: 30px;
    }

    .menubar {
       filter: progid:DXImageTransform.Microsoft.Gradient(gradienttype=0, startcolorstr=#F7F7F7, endcolorstr=#DEDBD6);
       font-size: 12px;
       height: 30px;
       width: 368px;
    }

    .botimg{
       border: 1px inset;
       width: 1px;
    }
    -->
    </style>
    <body style="background-color:#BFBFBF;">
    <table class="menubar">
       <td>
        <img class="botimg" /><br />
        <img class="botimg" /><br />
        <img class="botimg" /><br />
        <img class="botimg" /><br />
        <img class="botimg" /><br />
        <img class="botimg" /><br />
       </td>
     <td>
          姓名
      <input type="text" name="T5" size="18" class="lostfocus" gf="0" onmouseover='this.className="getfocus"' onmouseout='if (this.gf=="0") this.className="lostfocus"' onblur='this.className="lostfocus";this.gf="0"' onfocus='this.className="getfocus";this.gf="1"'>
      密码
      <input type="password" name="T6" size="18" class="lostfocus" gf="0" onmouseover='this.className="getfocus"' onmouseout='if (this.gf=="0") this.className="lostfocus"' onblur='this.className="lostfocus";this.gf="0"' onfocus='this.className="getfocus";this.gf="1"'>
          <img height=16 class="botimg" style="vertical-align:bottom;">
     </td>
       <td class="leftitem" gf="0" onmouseover='this.className="leftitemOver"' onmouseout='if (this.gf=="0") this.className="leftitem"' onblur='this.className="leftitem";this.gf="0"' onmousedown='this.className="leftitemDown";this.gf="0"' onfocus='this.className="leftitem";this.gf="1"'>
      <a>登陆</a>
       </td>
    </table>

    Tag：CSS 代码分享 原创
    Ghost 发表于18:41 | 阅读全文 | 评论 0 | 编辑 | 推荐

  • [原] 1px表格

    2005-09-13

    今天刚搞出来的，留下以后可以用。
    -------------------------------------------
    /*CSS样式表*/
    table{
       border-collapse: collapse;/*设置单元格的边合并在一起*/
       empty-cells : show;/*设置单元格无内容时，显示该单元格的边框*/
    }
    td{
       border: #000000 solid 1px;/*设置边框*/
       padding: 3px;/*内容与边框的间距*/
    }
    Tag：CSS 代码分享 原创
    Ghost 发表于18:38 | 阅读全文 | 评论 0 | 编辑 | 推荐
共9页 第一页 上一页 1 2 3 4 5 6 7 8 9