<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Moondy’s Zone &#187; bug</title>
	<atom:link href="http://www.moondyzone.com/tag/bug/feed" rel="self" type="application/rss+xml" />
	<link>http://www.moondyzone.com</link>
	<description>一位IT民工的点点滴滴……  WEB前端、网页重构、AS3</description>
	<lastBuildDate>Mon, 18 Apr 2011 10:06:33 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.9.2</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
		
<!-- Start Of Script Generated By WP-PostViews Plus -->
<script type='text/javascript' src='http://www.moondyzone.com/wp-includes/js/jquery/jquery.js?ver=1.3.2'></script>
<script type="text/javascript">
/* <![CDATA[ */
/* ]]> */
</script>
<!-- End Of Script Generated By WP-PostViews Plus -->
	<item>
		<title>a:hover在IE6中的BUG</title>
		<link>http://www.moondyzone.com/css/529.html</link>
		<comments>http://www.moondyzone.com/css/529.html#comments</comments>
		<pubDate>Sun, 16 Aug 2009 08:30:28 +0000</pubDate>
		<dc:creator>Moondy</dc:creator>
				<category><![CDATA[Xhtml/Css]]></category>
		<category><![CDATA[bug]]></category>
		<category><![CDATA[IE6]]></category>

		<guid isPermaLink="false">http://www.moondyzone.com/?p=529</guid>
		<description><![CDATA[哎，最近工作太忙，都好久没来写点东西了。
这也是最近工作中碰到的一个问题，其实以前也经常碰到过。具体是这样的，有一个图片链接，为了有明显一些的提示效果，需要在鼠标移上去的时候把它放大。按思路来说，其实是很容易的，只要在a:hover img{}里定义鼠标经过时改变图片的大小就可以了。但实际上，在IE6中，a:hover img{}里定义的内容并不生效。
IE6对伪类的支持真的很烂，除了A标签外其它标签都不支持:hover伪类，而偏偏这个唯一支持的a:hover也还有着BUG。解决的方法就是给a:hover {}定义一个属性：

a:hover &#123;zoom:1;&#125;/*这里可以换成其他很多的属性。*/
a:hover img &#123;……&#125;

在网上找出的答案基本上都是这样，的确这样能解决问题，但却都没有说这个BUG到底是为什么。最初我是以为是要触发layout，但经过试验，不能触发layout的属性也能生效，比如说color、border之类的。也就是这一次，我才找到此BUG的原因所在：当a:hover {}的属性跟a {}中的是一样的时候，也就是说a:hover没有发生属性的改变，完全继承a的属性的时候，就会产生此BUG。所以给a:hover {}定义一个属性值就能解决这个问题，至于定义什么值就看具体情况了，至少可以不用zoom这个看起来有hack嫌疑的属性咯。
相关文章IE6中select挡住DIV的BUGIE6中出现重复字符的BUGCSS3测试之——QQ企鹅斜角导航及滑动门的延伸对CSS渲染效率的一些研究解决IE8的兼容问题，X-UA-Compatible meta标签]]></description>
		<wfw:commentRss>http://www.moondyzone.com/css/529.html/feed</wfw:commentRss>
		<slash:comments>10</slash:comments>
		</item>
		<item>
		<title>IE6中select挡住DIV的BUG</title>
		<link>http://www.moondyzone.com/css/312.html</link>
		<comments>http://www.moondyzone.com/css/312.html#comments</comments>
		<pubDate>Mon, 11 May 2009 07:20:34 +0000</pubDate>
		<dc:creator>Moondy</dc:creator>
				<category><![CDATA[Xhtml/Css]]></category>
		<category><![CDATA[bug]]></category>
		<category><![CDATA[IE6]]></category>
		<category><![CDATA[jquery]]></category>

		<guid isPermaLink="false">http://www.moondyzone.com/?p=312</guid>
		<description><![CDATA[前阵子碰到一个问题，就是在IE6中select会把浮动的DIV给挡住，通常情况都是用JS控制某个DIV显示隐藏的情况下发生的。这冲时候不管怎么设z-index值都没有用。

我也查了很多资料，说这是IE6的一个BUG（哎，万恶的IE6），解决的办法不外乎两种：1、用DIV模拟一个select出来。2、在隐藏层的底部加一个透明的iframe。第一种感觉花的工夫比较大，暂时就用第二种方法了，我这个原本用的是jquery的框架，这里我就把jquery的帖上来了。在你要调用的JS文件里加上这么一段：

1
2
3
4
5
6
7
8
9
10
11
12
&#40;function&#40;$&#41;&#123;$.fn.bgIframe=$.fn.bgiframe=function&#40;s&#41;&#123;
if&#40;$.browser.msie&#38;amp;&#38;amp;/6.0/.test&#40;navigator.userAgent&#41;&#41;
&#123;s=$.extend&#40;&#123;top:'auto',left:'auto',width:'auto',height:'auto',opacity:true,
src:'javascript:false;'&#125;,s&#124;&#124;&#123;&#125;&#41;;var prop=function&#40;n&#41;&#123;
return n&#38;amp;&#38;amp;n.constructor==Number?n+'px':n;&#125;,html='&#38;lt;
iframe frameborder=&#34;0&#34;tabindex=&#34;-1&#34;src=&#34;'+s.src+'&#34;'+'style=&#34;display:block;
position:absolute;z-index:-1;top:0;left:0;width:100%;height:100%;
filter:alpha(opacity=0);-moz-opacity:0;&#34;/&#38;gt;';
return this.each&#40;function&#40;&#41;
&#123;if&#40;$&#40;'&#38;gt; iframe.bgiframe',this&#41;.length==0&#41;
this.insertBefore&#40;document.createElement&#40;html&#41;,this.firstChild&#41;;
&#125;&#41;;&#125;return this;&#125;;&#125;&#41;&#40;jQuery&#41;;

然后在你应用的页面调用

1
2
3
4
5
&#60;script&#62;
  $&#40;document&#41;.ready&#40;function&#40;e&#41;&#123;
   $&#40;'.your_class'&#41;.bgiframe&#40;&#41;;
 &#125;&#41;//其中your_class是被挡住的层的类名。
&#60;/script&#62;

相关文章a:hover在IE6中的BUG全兼容的标准三级菜单IE6中出现重复字符的BUGCSS3测试之——QQ企鹅斜角导航及滑动门的延伸对CSS渲染效率的一些研究]]></description>
		<wfw:commentRss>http://www.moondyzone.com/css/312.html/feed</wfw:commentRss>
		<slash:comments>5</slash:comments>
		</item>
	</channel>
</rss>

