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 相关文章推荐
Google Suggest ;-) 基于js的动态下拉菜单
Oct 11 Javascript
用JS实现一个页面多个css样式实现
May 29 Javascript
让FireFox支持innerText的实现代码
Dec 01 Javascript
对 lightbox JS 图片控件进行了一下改造, 使其他支持复杂的图片说明
Mar 20 Javascript
谈一谈bootstrap响应式布局
May 23 Javascript
纯jQuery实现前端分页功能
Mar 23 jQuery
vue2 router 动态传参,多个参数的实例
Nov 10 Javascript
JS实现非首屏图片延迟加载的示例
Jan 06 Javascript
200行代码实现blockchain 区块链实例详解
Mar 14 Javascript
QRCode.js二维码生成并能长按识别
Oct 16 Javascript
JQuery通过键盘控制键盘按下与松开触发事件
Aug 07 jQuery
Openlayers学习之地图比例尺控件
Sep 28 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
dedecms防止FCK乱格式化你的代码的修改方法
2007/03/17 PHP
ExtJS与PHP、MySQL实现存储的方法
2010/04/02 PHP
Zend Framework中的简单工厂模式 图文
2012/07/10 PHP
PHP实现服务器状态监控的方法
2014/12/09 PHP
详解PHP序列化反序列化的方法
2015/10/27 PHP
PHP微信企业号开发之回调模式开启与用法示例
2017/11/25 PHP
jQuery技巧总结
2011/01/01 Javascript
IE8对JS通过属性和数组遍历解析不一样的地方探讨
2013/05/06 Javascript
js仿百度有啊通栏展示效果实现代码
2013/05/28 Javascript
JS的location.href跳出框架打开新页面的方法
2014/09/04 Javascript
Javascript实现代码折叠功能
2016/08/25 Javascript
JavaScript生成验证码并实现验证功能
2016/09/24 Javascript
使用 jQuery.ajax 上传带文件的表单遇到的问题
2016/10/31 Javascript
使用canvas及js简单生成验证码方法
2017/04/02 Javascript
vue 1.0 结合animate.css定义动画效果
2018/07/11 Javascript
Nodejs把接收图片base64格式保存为文件存储到服务器上
2018/09/26 NodeJs
JS使用Dijkstra算法求解最短路径
2019/01/17 Javascript
nodejs 递归拷贝、读取目录下所有文件和目录
2019/07/18 NodeJs
Vue退出登录时清空缓存的实现
2019/11/12 Javascript
深入学习Python中的上下文管理器与else块
2017/08/27 Python
Django组件cookie与session的具体使用
2019/06/05 Python
深入了解python中元类的相关知识
2019/08/29 Python
python实现发送邮件
2021/03/02 Python
西班牙最大的在线滑板和街头服饰商店:Fillow.net
2019/04/15 全球购物
信息管理专业推荐信
2013/10/29 职场文书
商务日语毕业生自荐信
2013/11/23 职场文书
单位办理社保介绍信
2014/01/10 职场文书
写好自荐信需做到的5要点
2014/03/07 职场文书
六个一活动实施方案
2014/03/21 职场文书
自我鉴定书
2014/03/24 职场文书
幼儿园小班评语
2014/04/18 职场文书
产品推广策划方案
2014/05/10 职场文书
门卫岗位职责
2015/02/09 职场文书
2015年保安个人工作总结
2015/04/02 职场文书
使用Ajax实现进度条的绘制
2022/04/07 Javascript
Go gorilla/sessions库安装使用
2022/08/14 Golang