li:hover在ie6下失效的解决方案
li:hover在ie6下是无效的,它只在ie7以下版本有效.要解决这个问题有两个解决方法.一个是用js来解决,但是这种方法我不喜欢,因为它必需把js代码和css代码都放在html文件中.第二种是在每个li外面包裹一个 加了IE6条件注释的 用A包裹了的table
类似于:
HTML code
<!--[if lte IE
6]>
<a><table><tr><td>
<![endif]-->
<li>xxxxxxxxxx</li>
<!--[if
lte IE
6]>
</td></tr></table></a>
<![endif]-->
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>by commy </title>
<script
language="javascript">
stuHover = function() {
var cssRule;
var
newSelector;
for (var i = 0; i < document.styleSheets.length; i++)
for (var x = 0; x < document.styleSheets[i].rules.length ; x++)
{
cssRule = document.styleSheets[i].rules[x];
if
(cssRule.selectorText.indexOf("LI:hover") != -1)
{
newSelector =
cssRule.selectorText.replace(/LI:hover/gi, "LI.iehover");
document.styleSheets[i].addRule(newSelector , cssRule.style.cssText);
}
}
var getElm =
document.getElementById("nav").getElementsByTagName("LI");
for (var i=0;
i<getElm.length; i++) {
getElm[i].onmouseover=function() {
this.className+=" iehover";
}
getElm[i].onmouseout=function()
{
this.className=this.className.replace(new RegExp(" iehover\\b"),
"");
}
}
}
if (window.attachEvent) window.attachEvent("onload",
stuHover);
</script>
<style type="text/css">
li:hover {
background:#00CC00; display:block; }
</style>
</head><body
>
<div
id="nav">
<ul><li>让IE6支持li:hover的JS代码</li></ul>
</div>
</body>
</html>
li:hover在ie6下失效的解决方案的更多相关文章
- DD_belatedPNG,IE6下PNG透明解决方案
我们知道IE6是不支持透明的PNG的,这无疑限制了网页设计的发挥空间. 然而整个互联网上解决这个IE6的透明PNG的方案也是多不胜数,从使用IE特有的滤镜或是expression,再到javascr ...
- jQuery的$.getJSON方法在IE浏览器下失效的解决方案
$.getJSON在IE下默认会使用浏览器缓存,所以导致数据不正确或者异常,解决方案就是在使用该方法前关闭缓存,使用完后再重新打开缓存即可. <?php $.ajaxSetup({ cache: ...
- jquery submit ie6下失效的原因分析及解决方法
ie6中, $('a.btn').click(function(){ form.submit(); }) 点击失效: 分析: 微软低版本浏览器会先执行link标签的自身事件也就是href事件,这样就中 ...
- IE6下CSS常见兼容性问题及解决方案
1. 在IE6元素浮动,如果宽度需要内容撑开,就给里面的块元素加浮动. 2. IE6下最小高度问题:在IE6下元素高度小于19px的时候,会被当作19px处理.解决方案:给元素加 overflow:h ...
- IE6下Png透明最佳解决方案(推荐) Unit PNG Fix
引自:http://www.yeeyan.org/articles/view/98510/67784 网络上解决IE6下Png透明解决方案有很多,例如 IE PNG Fix from TwinHeli ...
- 【css】a:hover 设置上下边框在 ie6 和 ie7 下失效
前段时间在写样式的时候发现了这个问题,虽然当时就解决了这个 bug 不过还是记录下,以免再次出现这样的问题. demo 代码: <!doctype html> <html lang= ...
- IE6不支持li:hover的解决办法,一句代码让IE6支持li:hover
如果不是因为工作需要,我根本不会理会IE6的兼容问题,甚至我都不想理会IE的所有内核,不过IE9用了下,我还是重新对IE报以期待的.话题扯远了,下面回到话题上来吧.这次要说的内容就是,如果让IE支持l ...
- IE6下面的hover不兼容
第一种解决方法: ie6中hover只是对a标签有作用 必须有href=“”,否则都不管用,如果不能写a标签,还想让ie6下有滑过效果,那只能写javascript或者jquery. 例如:ie6是不 ...
- IE6下z-index失效
一.匆匆带过的概念关于CSS中层级z-index的定义啊什么的不是本文的重点,不会花费过多篇幅详细讲述.这里就简单带过,z-index伴随着层的概念产生的.网页 中,层的概念与photoshop或是f ...
随机推荐
- js 函数声明方式以及javascript的历史
1.function xx(){} 2.匿名方式 window.onload=function(){dslfjdslfkjdslf}; 3.动态方式 var demo=new Function ...
- c++标准库中几个常见的数据结构的区别和应用规则
转载自http://www.lifecrunch.biz/archives/202 vector和built-in数组类似,它拥有一段连续的内存空间,并且起始地址不变,因此它能非常好的支持随即存取,即 ...
- Android 中4种屏幕尺寸
具体信息,请参考 Android 官方文档 Supporting Multiple Screens small(屏幕尺寸小于3英寸左右的布局), normal(屏幕尺寸小于4.5英寸左右), lar ...
- sql SELECT时的with(nolock)选项说明
I used to see my senior developers use WITH (NOLOCK) when querying in SQL Server and wonder why they ...
- MySQL入门书籍和方法分享
本文罗列了一些适用于MySQL及运维入门和进阶使用的书籍. 背景:各大论坛上总是有很多同学咨询想学习数据库,或者是为入行DBA做些准备.几年来作为一个MySQL DBA的成长过程有一些积累和感悟,特此 ...
- Java for LeetCode 071 Simplify Path
Given an absolute path for a file (Unix-style), simplify it. For example, path = "/home/", ...
- 深入Java单例模式【转载】
在GoF的23种设计模式中,单例模式是比较简单的一种.然而,有时候越是简单的东西越容易出现问题.下面就单例设计模式详细的探讨一下. 所谓单例模式,简单来说,就是在整个应用中保证只有一个类的实例存在 ...
- iphone越狱还原
在Cydia 里安装Impactor 就行了 .在操作时需要全程联网: .请至少保证 % 的电量以防止在恢复过程出现断电的情况(建议将设备连接至电源): .设备将恢复至出厂状态,所有用户数据都将被清除 ...
- 大神的游戏(codevs 1353)
题目描述 Description 在那遥远的机房,有一片神奇的格子.为了方便起见,我们编号为1~n.传说只要放入一些卡片,就能实现愿望.卡片一共有m种颜色,但是相邻的格子间不能放入相同颜色的卡片.只要 ...
- 【读书笔记】读《高性能JavaScript》
这本<高性能JavaScript>讲述了有关JavaScript性能优化的方方面面,主要围绕以下几个方面: 1> 加载顺序 2> 数据访问(如怎样的数据类型访问最快,怎样的作用 ...