li隔行换色改进版

时间:2024-04-29 13:40:23 

ghhs("nav01","li"); // 鼠标经过时变色 
ghhs("nav02","li","no"); // 只隔行换色 
ghhs("nav03","li","onclick"); // 鼠标点击当前标记变色 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">  <html xmlns="http://www.w3.org/1999/xhtml" lang="zh-CN" xml:lang="zh-CN">  <head>  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  <meta name="keywords" content="PRcss,xhtml,html,css,js,book,个人主页,无聊,神经,懒惰" />  <meta name="description" content="PRcss的个人主页,无聊的,神经的,懒惰的..." />  <meta name="Author" content="PRcss,qq:50198763" />  <meta name="Copyright" content="本页版权归PRcss所有。All Rights Reserved" />  <title>隔行换色 - www.aspxhome.com 脚本之家</title>  <script type="text/javascript">  // 返回Id、Tag  function Pid(id,tag){  if(!tag){return document.getElementById(id);}  else{return document.getElementById(id).getElementsByTagName(tag);}  }  // 隔行换色  function ghhs(id,tag,s) {      var line=Pid(id,tag);      for (var i=1;i<line.length+1;i++) {           line[i-1].className=(i%2>0)?"t1":"t2";       }      if(s=="no"){          return;      }      else if(!s){          for(var i=0;i<line.length;i++) {              line[i].onmouseover=function(){                  this.tmpClass=this.className;                  this.className+=" up";              }              line[i].onmouseout=function(){                  this.className=this.tmpClass;              }          }      }      else{          for(var i=0;i<line.length;i++) {              line[i].tmep=i;              line[i][s]=function(){                  ghhs_tab(this.tmep);              }          }      }      function ghhs_tab(s){          for(var i=0;i<line.length;i++){              if(!line[i].tmpClass){                  line[i].tmpClass=line[i].className+=" pr1984_com";              }              if(s==i){                  line[i].className+=" up";              }              else {                  line[i].className=line[i].tmpClass;              }          }      }  }  </script>  <style type="text/css">  .t1 {background:#eee;}  .t2 {background:#fff;}  .up {background:#ddd;}  </style>  </head>  <body>  <div id="nav01">  <ul>  <li>路过</li><li>asdsad</li><li>asdsad</li><li>asdsad</li>  </ul>  </div>  <div id="nav02">  <ul>  <li>无视路过</li><li>asdsad</li><li>asdsad</li><li>asdsad</li>  </ul>  </div>  <div id="nav03">  <ul>  <li>踩我</li><li>asdsad</li><li>asdsad</li><li>asdsad</li>  </ul>  </div>  <script type="text/javascript">  ghhs("nav01","li");  ghhs("nav02","li","no");  ghhs("nav03","li","onclick");  </script>  </body>  </html>


标签:li,隔行换色,改进版
0
投稿

猜你喜欢

  • FrontPage2002简明教程七:HTML在FrontPage中的应用

    2008-09-17 11:33:00
  • Python3使用requests模块实现显示下载进度的方法详解

    2021-03-26 21:14:52
  • laravel清除视图缓存的代码

    2023-11-24 14:39:39
  • python提取具有某种特定字符串的行数据方法

    2022-09-20 08:12:55
  • mysql 5.7.13 安装配置方法图文教程(win10 64位)

    2024-01-28 09:07:21
  • 带你轻松了解 SQL Server数据库的组成

    2009-02-05 15:53:00
  • Django在win10下的安装并创建工程

    2021-10-12 18:54:57
  • python基础知识之索引与切片详解

    2023-11-30 03:03:52
  • keras之权重初始化方式

    2023-06-01 19:04:44
  • 揭秘SQL Server 2008性能和可扩展性

    2009-03-10 14:47:00
  • Python3 pandas 操作列表实例详解

    2021-11-30 14:24:12
  • 通过实例了解python__slots__使用方法

    2023-03-16 13:24:50
  • Python机器学习利用鸢尾花数据绘制ROC和AUC曲线

    2023-09-06 23:18:24
  • SQL 中having 和where的区别分析

    2024-01-17 17:23:24
  • mysql query browser中文乱码的解决方法

    2024-01-17 14:44:51
  • C#获取微信小程序的云数据库中数据的示例代码

    2024-01-18 07:30:59
  • vue-cli与webpack处理静态资源的方法及webpack打包的坑

    2024-05-09 09:39:07
  • 基于jsp实现新闻管理系统 附完整源码

    2023-07-10 15:35:53
  • Python imageio读取视频并进行编解码详解

    2021-02-20 07:32:53
  • tensorflow入门:tfrecord 和tf.data.TFRecordDataset的使用

    2022-06-29 16:23:40
  • asp之家 网络编程 m.aspxhome.com