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 相关文章推荐
Prototype使用指南之ajax
Jan 10 Javascript
js实现div的切换特效上一个下一个
Feb 11 Javascript
JavaScript合并两个数组并去除重复项的方法
Jun 13 Javascript
javascript中字体浮动效果的简单实例演示
Nov 18 Javascript
javascript求日期差的方法
Mar 02 Javascript
jquery自定义显示消息数量
Dec 19 jQuery
微信小程序实现美团菜单
Jun 06 Javascript
Vue实现双向绑定的原理以及响应式数据的方法
Jul 02 Javascript
详解Vue SSR( Vue2 + Koa2 + Webpack4)配置指南
Nov 13 Javascript
使用 webpack 插件自动生成 vue 路由文件的方法
Aug 20 Javascript
VsCode与Node.js知识点详解
Sep 05 Javascript
vue props对象validator自定义函数实例
Nov 13 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
php+dojo 的数据库保存拖动布局的一个方法dojo 这里下载
2007/03/07 PHP
PHP缓存集成库phpFastCache用法
2014/12/15 PHP
php从csv文件读取数据并输出到网页的方法
2015/03/14 PHP
PHP执行linux命令常用函数汇总
2016/02/02 PHP
微信红包随机生成算法php版
2016/07/21 PHP
php 广告点击统计代码(php+mysql)
2018/02/21 PHP
php和vue配合使用技巧和方法
2019/05/09 PHP
flexigrid 类似ext grid的JS表格代码
2010/07/17 Javascript
JavaScript事件委托技术实例分析
2015/02/06 Javascript
JQuery中extend的用法实例分析
2015/02/08 Javascript
javascript使用输出语句实现网页特效代码
2015/08/06 Javascript
Jquery效果大全之制作电脑健康体检得分特效附源码下载
2015/11/02 Javascript
JS对HTML表格进行增删改操作
2016/08/22 Javascript
javascript轮播图算法
2016/10/21 Javascript
Vuex和前端缓存的整合策略详解
2017/05/09 Javascript
Swiper实现轮播图效果
2017/07/03 Javascript
JS倒计时实例_天时分秒
2017/08/22 Javascript
Vue CL3 配置路径别名详解
2019/05/30 Javascript
实用Javascript调试技巧分享(小结)
2019/06/18 Javascript
NodeJS多种创建WebSocket监听的方式(三种)
2020/06/04 NodeJs
[40:06]DOTA2亚洲邀请赛 4.3 突围赛 Liquid vs VGJ.T 第一场
2018/04/04 DOTA
pygame实现俄罗斯方块游戏
2018/06/26 Python
在python里协程使用同步锁Lock的实例
2019/02/19 Python
Python实现KNN(K-近邻)算法的示例代码
2019/03/05 Python
Python常见数字运算操作实例小结
2019/03/22 Python
美国知名保健品网站:LuckyVitamin(支持中文)
2017/08/09 全球购物
Expedia挪威官网:酒店、机票和租车
2018/03/03 全球购物
历史专业个人求职信分享
2013/12/20 职场文书
ktv中秋节活动方案
2014/01/30 职场文书
公司请假条范文
2014/04/11 职场文书
卫校毕业生个人自我鉴定
2014/04/28 职场文书
国庆宣传标语
2014/06/30 职场文书
县委务虚会发言材料
2014/10/20 职场文书
幼儿园托班开学寄语(2016秋季)
2015/12/03 职场文书
pytorch实现手写数字图片识别
2021/05/20 Python
带你了解CSS基础知识,样式
2021/07/21 HTML / CSS