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 相关文章推荐
javascript 命名空间以提高代码重用性
Nov 13 Javascript
jQuery ajax(复习)—Baidu ajax request分离版
Jan 24 Javascript
jQuery中closest和parents的区别分析
May 07 Javascript
easyui Droppable组件实现放置特效
Aug 19 Javascript
微信企业号开发之微信考勤百度地图定位
Sep 11 Javascript
Jquery-1.9.1源码分析系列(十一)之DOM操作
Nov 25 Javascript
多个js毫秒倒计时同时进行效果
Jan 05 Javascript
微信小程序 action-sheet底部菜单详解
Oct 27 Javascript
解决Vue编译时写在style中的路径问题
Sep 21 Javascript
详解使用jest对vue项目进行单元测试
Sep 07 Javascript
ES6常用小技巧总结【去重、交换、合并、反转、迭代、计算等】
Dec 21 Javascript
深入理解webpack process.env.NODE_ENV配置
Feb 23 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
PHP7标量类型declare用法实例分析
2016/09/26 PHP
FireFox JavaScript全局Event对象
2009/06/14 Javascript
html页面显示年月日时分秒和星期几的两种方式
2013/08/20 Javascript
js实现幻灯片效果(基于jquery插件)
2013/11/05 Javascript
js闭包实例汇总
2014/11/09 Javascript
jQuery获取URL请求参数的方法
2015/07/18 Javascript
超漂亮的jQuery图片轮播特效
2015/11/24 Javascript
JS实现鼠标移上去显示图片或微信二维码
2016/12/14 Javascript
微信小程序实现图片上传
2019/05/23 Javascript
原生JS实现萤火虫效果
2020/03/07 Javascript
jQuery实现的移动端图片缩放功能组件示例
2020/05/01 jQuery
js实现微信聊天效果
2020/08/09 Javascript
微信小程序实现弹幕墙(祝福墙)
2020/11/18 Javascript
[02:34]2016完美“圣”典风云人物:BurNIng专访
2016/12/10 DOTA
[51:36]Optic vs Newbee 2018国际邀请赛小组赛BO2 第一场 8.17
2018/08/18 DOTA
python pandas 如何替换某列的一个值
2018/06/09 Python
Python安装pycurl失败的解决方法
2018/10/15 Python
python3实现表白神器
2019/04/09 Python
python 二维矩阵转三维矩阵示例
2019/11/30 Python
Python paramiko 模块浅谈与SSH主要功能模拟解析
2020/02/29 Python
如何使用pandas读取txt文件中指定的列(有无标题)
2020/03/05 Python
python实现手势识别的示例(入门)
2020/04/15 Python
TUMI新加坡官网:国际领先的商旅箱包品牌
2019/01/12 全球购物
Notino匈牙利:购买香水和化妆品
2019/04/12 全球购物
Ancheer官方户外和运动商店:销售电动自行车
2019/08/07 全球购物
搞笑创意广告语
2014/03/17 职场文书
初二学习计划书范文
2014/04/27 职场文书
学校安全责任书范本
2014/07/23 职场文书
民事授权委托书范文
2014/08/02 职场文书
机动车登记业务委托书
2014/10/08 职场文书
2014年变电站工作总结
2014/12/19 职场文书
给老婆的检讨书(搞笑版)
2015/05/06 职场文书
准备去美国留学,那么大学申请文书应该怎么写?
2019/08/12 职场文书
创业计划书之面包店
2019/09/12 职场文书
php去除数组中为0的元素的实例分析
2021/11/17 PHP
Go Grpc Gateway兼容HTTP协议文档自动生成网关
2022/06/16 Golang