javascript解决IE6下hover问题的方法


Posted in Javascript onJuly 28, 2015

有时候我们想在非a标签上加hover元素 但是我们都知道IE6下不支持XX:hover,所以我们现在可以用js实现掉:代码如下

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>无标题文档</title> 
<style> 
#nav li:hover, #nav li.stest { 
  font-weight:700; 
  color:red; 
} 
</style> 
</head> 
 
<body> 
  <ul id="nav"> 
    <li>列表一</li> 
    <li>列表一</li> 
    <li>列表一</li> 
  </ul> 
 
<script type="text/javascript"> 
  var Hover = function(){ 
    var listItem = document.getElementById("nav").getElementsByTagName("li"); 
    for(var i=0;i<listItem.length;i++){ 
      listItem[i].onmouseover = function(){ 
        this.className +=" stest";  
      } 
      listItem[i].onmouseout = function(){ 
        thisthis.className = this.className.replace(/stest\b/, ""); // \b 查找位于单词的开头或结尾的匹配。 
      }  
    }  
  } 
if(window.attachEvent){ 
  window.attachEvent('onload',Hover); 
} 
</script> 
 
</body> 
</html>

以上内容就是告诉大家javascript解决IE6下hover问题的方法,希望对大家的学习有所帮助。

Javascript 相关文章推荐
style、 currentStyle、 runtimeStyle区别分析
Aug 01 Javascript
Ubuntu 11.10 安装Node.js的方法
Nov 30 Javascript
struts2+jquery+json实现异步加载数据(自写)
Jun 24 Javascript
javascript列表框操作函数集合汇总
Nov 28 Javascript
JS中的hasOwnProperty()和isPrototypeOf()属性实例详解
Aug 11 Javascript
Ubuntu系统下Angularjs开发环境安装
Sep 01 Javascript
js实现可旋转的立方体模型
Oct 16 Javascript
修改UA在PC中访问只能在微信中打开的链接方法
Nov 27 Javascript
浅谈实现vue2.0响应式的基本思路
Feb 13 Javascript
VUE2.0中Jsonp的使用方法
May 22 Javascript
vue自定义指令实现仅支持输入数字和浮点型的示例
Oct 30 Javascript
JavaScript HTML DOM 元素 (节点)新增,编辑,删除操作实例分析
Mar 02 Javascript
JavaScript如何自定义trim方法
Jul 28 #Javascript
详解JavaScript ES6中的Generator
Jul 28 #Javascript
深入解读JavaScript中的Iterator和for-of循环
Jul 28 #Javascript
JavaScript调用客户端Java程序的方法
Jul 27 #Javascript
详细解读JavaScript编程中的Promise使用
Jul 27 #Javascript
JavaScript中的Repaint和Reflow用法详解
Jul 27 #Javascript
javascript实现类似java中getClass()得到对象类名的方法
Jul 27 #Javascript
You might like
在Win7 中为php扩展配置Xcache
2014/10/08 PHP
thinkPHP中分页用法实例分析
2015/12/26 PHP
php基于curl主动推送最新内容给百度收录的方法
2016/10/14 PHP
PHP生成各种随机验证码的方法总结【附demo源码】
2017/06/05 PHP
JavaScript国旗变换效果代码
2008/08/13 Javascript
Javascript 中的类和闭包
2010/01/08 Javascript
海量经典的jQuery插件集合
2010/01/12 Javascript
js实现双向链表互联网机顶盒实战应用实现
2011/10/28 Javascript
webpack+vue.js快速入门教程
2016/10/12 Javascript
微信小程序的分类页面制作
2017/06/27 Javascript
node.js基于express使用websocket的方法
2017/11/09 Javascript
Angular-UI Bootstrap组件实现警报功能
2018/07/16 Javascript
Nodejs中使用puppeteer控制浏览器中视频播放功能
2019/08/26 NodeJs
浅谈监听单选框radio改变事件(和layui中单选按钮改变事件)
2019/09/10 Javascript
JS实现简易留言板特效
2019/12/23 Javascript
javascript中call,apply,bind的区别详解
2020/12/11 Javascript
Python实现的简单万年历例子分享
2014/04/25 Python
python的构建工具setup.py的方法使用示例
2017/10/23 Python
Python基于OpenCV库Adaboost实现人脸识别功能详解
2018/08/25 Python
解决PyCharm的Python.exe已经停止工作的问题
2018/11/29 Python
Python 实现两个服务器之间文件的上传方法
2019/02/13 Python
Python之关于类变量的两种赋值区别详解
2020/03/12 Python
粉红色的鲸鱼:Vineyard Vines
2018/02/17 全球购物
MYSQL相比于其他数据库有哪些特点
2013/07/19 面试题
销售人员自我评价怎么写
2013/09/19 职场文书
光电信息专业应届生求职信
2013/10/07 职场文书
法律专业实习鉴定
2013/12/22 职场文书
大学四年规划书范文
2013/12/27 职场文书
青年创业培训欢迎词
2014/01/10 职场文书
2014购房个人委托书范本
2014/10/12 职场文书
群众路线教育实践活动总结
2014/10/30 职场文书
前台接待岗位职责范本
2015/04/03 职场文书
母亲去世追悼词
2015/06/23 职场文书
素质拓展训练感想
2015/08/07 职场文书
大学组织委员竞选稿
2015/11/21 职场文书
vue3不同环境下实现配置代理
2022/05/25 Vue.js