以下为csshover.htc 内容

<attach event="ondocumentready" handler="parseStylesheets" />
<script language="JScript">

var currentSheet, doc = window.document, activators = {
onhover:{on:'onmouseover', off:'onmouseout'},
onactive:{on:'onmousedown', off:'onmouseup'}
}

function parseStylesheets() {
//window.alert("hi");
var sheets = doc.styleSheets, l = sheets.length;
for(var i=0; i<l; i++) 
   parseStylesheet(sheets[i]);
}
function parseStylesheet(sheet) {
   if(sheet.imports) {
    try {
     var imports = sheet.imports, l = imports.length;
     for(var i=0; i<l; i++) parseStylesheet(sheet.imports[i]);
    } catch(securityException){}
   }

try {
    var rules = (currentSheet = sheet).rules, l = rules.length;
    for(var j=0; j<l; j++) parseCSSRule(rules[j]);
   } catch(securityException){}
}

function parseCSSRule(rule) {
   var select = rule.selectorText, style = rule.style.cssText;
   if(!(/(^|\s)(([^a]([^ ]+)?)|(a([^#.][^ ]+)+)):(hover|active)/i).test(select) || !style) return;
  
   var pseudo = select.replace(/[^:]+:([a-z-]+).*/i, 'on$1');
   var newSelect = select.replace(/(\.([a-z0-9_-]+):[a-z]+)|(:[a-z]+)/gi, '.$2' + pseudo);
   var className = (/\.([a-z0-9_-]*on(hover|active))/i).exec(newSelect)[1];
   var affected = select.replace(/:hover.*$/, '');
   var elements = getElementsBySelect(affected);

currentSheet.addRule(newSelect, style);
   for(var i=0; i<elements.length; i++)
    new HoverElement(elements[i], className, activators[pseudo]);
}

function HoverElement(node, className, events) {
if(!node.hovers) node.hovers = {};
if(node.hovers[className]) return;
node.hovers[className] = true;
node.attachEvent(events.on,
   function() { node.className += ' ' + className; });
node.attachEvent(events.off,
   function() { node.className = 
    node.className.replace(new RegExp('\\s+'+className, 'g'),''); });
}

function getElementsBySelect(rule) {
var parts, nodes = [doc];
parts = rule.split(' ');
for(var i=0; i<parts.length; i++) {
   nodes = getSelectedNodes(parts[i], nodes);
} return nodes;
}
function getSelectedNodes(select, elements) {
   var result, node, nodes = [];
   var classname = (/\.([a-z0-9_-]+)/i).exec(select);
   var identify = (/\#([a-z0-9_-]+)/i).exec(select);
   var tagName = select.replace(/(\.|\#|\:)[a-z0-9_-]+/i, '');
   for(var i=0; i<elements.length; i++) {
    result = tagName? elements[i].all.tags(tagName):elements[i].all; 
    for(var j=0; j<result.length; j++) {
     node = result[j];
     if((identify && node.id != identify[1]) || (classname && !(new RegExp('\\b' +
      classname[1] + '\\b').exec(node.className)))) continue;
     nodes[nodes.length] = node;
    }
   } return nodes;
}
</script>

--------------------------------------

使用方法

<style type="text/css">

body { behavior: url(csshover.htc); }

</style>

----------------------------------

下面一个小例子,实现 li:hover 在IE6下有效。 测试平台 IETester IE6

<!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=gb2312" />
<title>无标题文档</title>
<style type="text/css">
body{ behavior:url("style/csshover.htc");}
ul,li{list-style:none; margin:0; padding:0;}
ul li{width:80px; height:30px; line-height:30px;}
ul li ul {display:none; padding-left:10px;}
ul li:hover ul {display:block;}
</style>
</head>

<body>
<div>
 <ul>
  <li><a href="#">一级菜单</a>
   <ul>
    <li><a href="#">二级菜单</a></li>
   </ul>
  </li>
 </ul>
</div>
</body>
</html>

附:JQuery解决方法:

function hoverFunc(select, css){

$(select).hover(

function(){

$(this).addClass(css);

},

function(){

$(this).removeClass(css);

}

)

}

hoverFunc('#bt1', 't1_hover');

hoverFunc('.exp_1', 'exp_1_hover');

csshover.htc CSS兼容的更多相关文章

  1. CSS兼容各浏览器的hack

    CSS兼容各浏览器的hack:建议:尽可能的手写代码,可以有效的提高学习效率和深度.浏览器的种类多,麻烦自然也多,主要是各种浏览器对某些属性的渲染效果并不相同,所以有时候需要专门针对特定浏览器或者特定 ...

  2. 主流浏览器css兼容问题的总结

    最近又搞了一波网站的兼容,由于要求ie浏览器还是要兼容到ie8,所以调起来还是各种蛋疼. 现在就post一些做兼容的总结,可能不够全面,但是可以告诉大家如何避过一些坑.主要测试了chrome,fire ...

  3. CSS兼容问题实用建议

    CSS兼容问题,是美工最头痛的问题.做测试时,用谷哥和360浏览器(最新)都没有什么问题,用 IE6/IE8测试,问题就冒出来了.微软现在出IE10,我电脑上已经无法用IE6准确测试,IE-TESTE ...

  4. css兼容问题集合

    css兼容问题 兼容问题 1.文字本身的大小不兼容.同样是font-size:14px的宋体文字,在不同浏览器下占的空间是不一样的,ie下实际占高16px,下留白3px,ff下实际占高17px,上留白 ...

  5. css兼容各个浏览器的三角形图标

    css兼容各个浏览器的三角形图标 在当前流行的的网站上,我们经常会看到一些小三角形的下拉提示(微博顶部的下拉菜单),简单的方式可以使用一张图片代替,但是随着前端技术的发展,以及开发者对于前端性能的“吹 ...

  6. CSS兼容常用技巧

    请尽量用xhtml格式写代码,而且DOCTYPE影响 CSS 处理,作为W3C标准,一定要加DOCTYPE声明. 1.div的垂直居中问题 vertical-align:middle; 将行距增加到和 ...

  7. ie6 7 8 9 firefox的css兼容问题

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  8. css兼容问题与实践归纳总结

    css兼容问题与实践归纳总结 一.IE6/7 原生块元素与display:inline-block; <div style="display:inline-block;"&g ...

  9. 浏览器 CSS 兼容写法的测试总结

    做前端最讨厌的就是 IE6,7,8,虽然被淘汰的浏览器,但是在中国用户仍然很多,不可能像国外网站一样直接就不管它了,这样会流失很多流量啊. 现在有了IE9,IE10还好些,几乎和 Chrome,Fir ...

随机推荐

  1. table 控制单双行颜色以及鼠标hover颜色 table光棒

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  2. WPF、Sivelright、UWP

    Sivelright:  http://www.cnblogs.com/webabcd/category/106371.html UWP 律师查询 MVVM WPF入门教程系列一——基础 WPF入门教 ...

  3. Custom work flow

    http://runjs.cn/detail/99epj1t2 http://www.cqroad.cn/ https://jsplumbtoolkit.com/demo/flowchart/dom. ...

  4. java树形目录展示

    package test; import java.awt.Component;import java.awt.Container;import java.util.ArrayList;import ...

  5. linux修改时间

    1.修改linux系统时间 [root@localhost ~]# date -s "2016-10-15 13:15:12" 2.将系统时间和网络服务器时间同步 [root@lo ...

  6. xcode8+iOS10问题

    .xcode升级到8.0后打印的问题 ()xcode8会打印一些莫名其妙的log 解决方法:Scheme里面添加OS_ACTIVITY_MODE = disable ()xcode8打印log不完整 ...

  7. Python3基础 列表乘一个整数 扩增列表

    镇场诗:---大梦谁觉,水月中建博客.百千磨难,才知世事无常.---今持佛语,技术无量愿学.愿尽所学,铸一良心博客.------------------------------------------ ...

  8. MySQL导入SQL文件及常用命令

      在MySQL Qurey   Brower中直接导入*.sql脚本,是不能一次执行多条sql命令的,在mysql中执行sql文件的命令: mysql> source   d:/myprogr ...

  9. JQuery下focus()无法自动获取焦点的处理方法 jquery如何使文本框获得焦点

    今天遇见这么一个小小的问题,就是文本框中需要输入内容才可以提交,如果没有输入就提示并使该文本框获得焦点! 这么一个简单的事情如果没有使用 jQuery的话 是不是对象.focus()就可以了, Jav ...

  10. .zip版初次安装mysql时遇到的my.ini、服务无法启动以及设置登录密码的问题

    下载mysql出现的问题 若下载的是.zip版,就是免安装的直接解压就可以的出现的问题 一.需要在E:\mysql\mysql-5.7.14-winx64目录下手动添加my.ini文件(.ini文件是 ...