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 YUI 读码日记之 YAHOO.util.Dom - Part.2 0
Mar 22 Javascript
关于jquery ajax 调用带参数的webservice返回XML数据一个小细节
Jul 31 Javascript
基于JQuery模仿苹果桌面的Dock效果(初级版)
Oct 15 Javascript
Jquery中request和request.form和request.querystring的区别
Nov 26 Javascript
Jquery+ajax+JAVA(servlet)实现下拉菜单异步取值
Mar 23 Javascript
15位和18位身份证JS校验的简单实例
Jul 18 Javascript
jQuery autoComplete插件两种使用方式及动态改变参数值的方法详解
Oct 24 Javascript
使用ionic播放轮询广告的实现方法(必看)
Apr 24 Javascript
4个顶级开源JavaScript图表库
Sep 29 Javascript
JS实现的贪吃蛇游戏案例详解
May 01 Javascript
react quill中图片上传由默认转成base64改成上传到服务器的方法
Oct 30 Javascript
详解Nuxt内导航栏的两种实现方式
Apr 16 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 Smarty date_format [格式化时间日期]
2010/03/15 PHP
php去掉字符串的最后一个字符附substr()的用法
2011/03/23 PHP
php对包含html标签的字符串进行截取的函数分享
2014/06/19 PHP
浅谈PHP值mysql操作类
2016/06/29 PHP
用JavaScript脚本实现Web页面信息交互
2006/12/21 Javascript
js下获取div中的数据的原理分析
2010/04/07 Javascript
JavaScript中定义函数的三种方法
2015/03/12 Javascript
五种js判断是否为整数类型方式
2015/12/03 Javascript
jQuery鼠标悬浮链接弹出跟随图片实例代码
2016/01/08 Javascript
jquery实现一个简单的表单验证实例
2016/03/30 Javascript
详解微信小程序开发—你期待的分享功能来了,微信小程序序新增5大功能
2016/12/23 Javascript
jquery无法为动态生成的元素添加点击事件的解决方法(推荐)
2016/12/26 Javascript
利用vue.js插入dom节点的方法
2017/03/15 Javascript
js学习总结_选项卡封装(实例讲解)
2017/07/13 Javascript
浅谈Vue内置component组件的应用场景
2018/03/27 Javascript
浅谈Vue响应式(数组变异方法)
2018/05/07 Javascript
在js代码拼接dom对象到页面上的模板总结
2018/10/21 Javascript
基于Koa(nodejs框架)对json文件进行增删改查的示例代码
2019/02/02 NodeJs
layui 点击重置按钮, select 并没有被重置的解决方法
2019/09/03 Javascript
node静态服务器实现静态读取文件或文件夹
2019/12/03 Javascript
JS原型对象操作实例分析
2020/06/06 Javascript
JS获取当前时间戳方法解析
2020/08/29 Javascript
[01:48]帕吉至宝加入游戏,遗迹战场现“千劫神屠”
2018/04/07 DOTA
python使用openpyxl库修改excel表格数据方法
2018/05/03 Python
通过python的matplotlib包将Tensorflow数据进行可视化的方法
2019/01/09 Python
使用pandas的box_plot去除异常值
2019/12/10 Python
python传到前端的数据,双引号被转义的问题
2020/04/03 Python
Django与pyecharts结合的实例代码
2020/05/13 Python
HTML5之SVG 2D入门9—蒙板及mask元素介绍与应用
2013/01/30 HTML / CSS
精灵市场:Pixie Market
2019/06/18 全球购物
广州迈达威.net面试题目
2012/03/10 面试题
中药学自荐信
2014/06/15 职场文书
社区关爱留守儿童活动方案
2014/08/22 职场文书
新员工试用期自我评价
2015/03/10 职场文书
Golang 空map和未初始化map的注意事项说明
2021/04/29 Golang
python数据处理之Pandas类型转换
2022/04/28 Python