zoukankan      html  css  js  c++  java
  • 【技术帖】IE6所有标签元素支持hover伪类的解决方案

    IE6是个顽皮的大爷。为了实现一些简单的效果,我们通常要做许多事情。比如li:hover ,td :hover这些东西,IE6向来不看。

    解决办法网上有许多,亲试了许多,只有以下才能解决,就是加一个tc文件就可以了!!

    步骤:

    1.在你的网页的同级目录下创建一个叫做iehoverfix.htc的文件,并在里面复制进去如下内容

    iehoverfix.htc文件内容:---------------------------------------------------此行不复制----------------------------------------------/*解决ie6.0 的hover兼容问题*/<attach event=”ondocumentready” handler=”parseStylesheets” /><script>var csshoverReg = /(^|\s)(([^a]([^ ]+)?)|(a([^#.][^ ]+)+)):(hover|active)/i,currentSheet, doc = window.document, hoverEvents = [], activators = {onhover:{on:’onmouseover’, off:’onmouseout’},onactive:{on:’onmousedown’, off:’onmouseup’}}function parseStylesheets() {if(!/MSIE (5|6)/.test(navigator.userAgent)) return;window.attachEvent(‘onunload’, unhookHoverEvents);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(!csshoverReg.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|active).*$/, ”);var elements = getElementsBySelect(affected);if(elements.length == 0) return;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;hookHoverEvent(node, events.on, function() { node.className += ‘ ‘ + className; });hookHoverEvent(node, events.off, function() { node.className = node.className.replace(new RegExp(‘\\s+’+className, ‘g’),”); });}function hookHoverEvent(node, type, handler) {node.attachEvent(type, handler);hoverEvents[hoverEvents.length] = {node:node, type:type, handler:handler};}function unhookHoverEvents() {for(var e,i=0; i<hoverEvents.length; i++) {e = hoverEvents[i];e.node.detachEvent(e.type, e.handler);}}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 identify = (/\#([a-z0-9_-]+)/i).exec(select);if(identify) {var element = doc.getElementById(identify[1]);return element? [element]:nodes;}var classname = (/\.([a-z0-9_-]+)/i).exec(select);var tagName = select.replace(/(\.|\#|\:)[a-z0-9_-]+/i, ”);var classReg = classname? new RegExp(‘\\b’ + classname[1] + ‘\\b’):false;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(classReg && !classReg.test(node.className)) continue;nodes[nodes.length] = node;}}return nodes;}</script>---------------------------------------------------此行不复制----------------------------------------------2.使用css导入iehoverfix.htc文件:

    <style type="text/css">

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

    </style>

    3.刷新一下页面,看看效果吧。li:hover 什么的全部都解决啦

  • 相关阅读:
    实习一面+二面+三面面经
    内核协议栈2
    android之activity生命周期图
    gcc1
    实习一
    android之startActivityForResult
    KFS
    android之使用DDMS帮助开发
    设计模式——工厂模式
    博客备份工具(博主网)开发略谈
  • 原文地址:https://www.cnblogs.com/ae6623/p/4416724.html
Copyright © 2011-2022 走看看