垂直メニューはこれが取り組んで私の非常に最初のサイトイムある

Question

IE8では動作しません：www.olgoya.com

問題は、マウスが上にあるときにIE8を除き、すべての主要なブラウザは、同様にサブメニューが表示されていることです'ポートフォリオ'の項目です。私が理解できることは、親オブジェクトの不透明度設定に問題があることです。削除するとIEはサブメニューも表示できます。

親オブジェクトの書式設定：

ul, li{text-align:right; margin:0; padding:0; list-style:none;} 
#menubg{position:absolute;top:1px;width:130px;left:25px;background:#000;opacity:0.5;filter:alpha(opacity=50);-khtml-opacity: 0.5;-moz-opacity: 0.5;bottom:1px;z-index:3} 

垂直メニューフォーマット：

/* 
Author: Craig Erskine 
Description: Dynamic Menu System - Vertical 
*/ 

ul#navmenu-v,ul#navmenu-v li,ul#navmenu-v ul { 
width: 130px; /* Menu Width */ 
margin: 0; 
list-style: none; 
} 

ul#navmenu-v li { float: left; position: relative; width: 100%; } 
ul#navmenu-v li.iehover { z-index: 1000;/* IE z-index bugfix */ } 

ul#navmenu-v ul { 
display: none; 
position: absolute; 
top: 0; 
left: 100%; 
z-index: 9999; 
} 

/* Root Menu */ 
ul#navmenu-v a { 
/* 
border-top: 1px solid #FFF; 
border-right: 1px solid #FFF; 
*/ 
padding: 6px; 
display: block; 
/* 
background: #DDD; 
color: #666; 
font: bold 11px Arial, sans-serif; 
*/ 
text-decoration: none; 
height: 1%; 
} 

/* Root Menu Hover Persistence */ 
ul#navmenu-v a:hover,ul#navmenu-v li:hover a,ul#navmenu-v li.iehover a { 
background: #444; 
/* color: #FFF; 
border-right: 1px solid #000; 
border-left: 5px solid #000; 
*/ 
} 

/* 2nd Menu */ 
ul#navmenu-v li:hover li a,ul#navmenu-v li.iehover li a { 
float: none; 
background: #000; 
} 

/* 2nd Menu Hover Persistence */ 
ul#navmenu-v li:hover li a:hover,ul#navmenu-v li:hover li:hover a,ul#navmenu-v li.iehover li a:hover,ul#navmenu-v li.iehover li.iehover a { 
background: #999; 
} 

/* 3rd Menu */ 
ul#navmenu-v li:hover li:hover li a,ul#navmenu-v li.iehover li.iehover li a { 
background: #999; 
} 

/* 3rd Menu Hover Persistence */ 
ul#navmenu-v li:hover li:hover li a:hover,ul#navmenu-v li:hover li:hover li:hover a,ul#navmenu-v li.iehover li.iehover li a:hover,ul#navmenu-v li.iehover li.iehover li.iehover a { 
background: #666; 
} 

/* 4th Menu */ 
ul#navmenu-v li:hover li:hover li:hover li a,ul#navmenu-v li.iehover li.iehover li.iehover li a { 
background: #666; 
} 

/* 4th Menu Hover */ 
ul#navmenu-v li:hover li:hover li:hover li a:hover,ul#navmenu-v li.iehover li.iehover li.iehover li a:hover { 
background: #333; 
} 

/* Hover Function - Do Not Move */ 
ul#navmenu-v li:hover ul ul,ul#navmenu-v li:hover ul ul ul,ul#navmenu-v li.iehover ul ul,ul#navmenu-v li.iehover ul ul ul { display: none; } 
ul#navmenu-v li:hover ul,ul#navmenu-v ul li:hover ul,ul#navmenu-v ul ul li:hover ul,ul#navmenu-v li.iehover ul,ul#navmenu-v ul li.iehover ul,ul#navmenu-v ul ul li.iehover ul { display: block; } 

それをチェックして、私に教えてどのように私はあまりにも強大なIEで透過的にメニューを持っている可能性があります！

Answer 1

いいえ 'Internet Explorerで、不透明度がサポートされていません！ありがたいことにIE9は不透明度をサポートしています。一方で、あなたは時々、jQueryを使って不透明度を設定することでこれを回避することができます

$('#menubg').css('opacity', '0.5'); 

UPDATE
それはあなたがする必要がありますどのような、あなたのために動作しませんでしたので、1ピクセル幅を作成しています、 1pxの高さ.pngの色は#000であり、不透明度は50％である。次に、このCSSルールを使用してください：

#menubg { background:url(/path/to/png.png) repeat;} 

そして、そのフィルタを取り除くと、それは悪魔です。