最近做了一個活動的彈層帮哈，需求如下:
彈層的背景顏色需要有透明度司顿，點擊非內容區(qū)域，需要關閉彈層盈蛮。
其實這個需求難度并不高废菱。背景色的css以及關閉彈層的點擊事件都很好寫。
貼一下背景的css代碼：
.window_shade_1{
width: 100%;
background: rgba(0,0,0,0.3);
position: fixed;
top:0;
right:0;
bottom:0;
left:0;
display: none;
z-index:999;
}
這個代碼在IE8以上的瀏覽器中是可以正常展示的眉反，點擊彈層的非內容部分也可以關閉彈層昙啄。
但是！４缥濉梳凛！
有個瀏覽器叫做IE8
在IE8下，彈層出現了兩個問題：
1.彈層的背景色不顯示了梳杏。（這個可以理解韧拒，畢竟我自己給自己挖了坑，用了rgba）
2.沒有辦法點擊到彈層的非內容處了十性，彈層的背景就想被鼠標穿透了一樣叛溢。鼠標點擊的時候，自動點到了彈層下面的部分了劲适。
不知道大家在寫彈層的時候楷掉，是否也遇到過類似的問題。
第一個問題霞势，是因為IE8不兼容rgba渲染顏色烹植，可以直接用IE8的兼容性寫法來解決。
第二個問題愕贡，是因為我們的背景沒有用圖片來渲染草雕，IE8下認為我們沒有背景，點擊的時候就點到了彈層的下一層固以。
解決問題的辦法墩虹，在IE8下，將rgba換成可以兼容IE8的寫法憨琳，并且引用一個空白作為我們的背景圖诫钓。
修改后的代碼如下：
<!--[if IE 8]>
<style>
.window_shade_1{
width: 100%;
position: fixed;
top:0;
left:0;
right:0;
bottom:0;
display: none;
z-index:999;
filter: progid:DXImageTransform.Microsoft.gradient(startcolorstr=#7F000000,endcolorstr=#7F000000);
background: url(about:blank);
}
</style>
<![endif]-->
這樣的話，沒有改變原來的css內容栽渴，只是在IE8下加了這段css尖坤，相當于當瀏覽器為IE8的時候。重新寫了這個元素的css闲擦。
但是需要注意的是：
<!--[if IE 8]> <![endif]-->
這個標簽慢味，相當于在IE8下給html中增加了一部分代碼场梆。如果需要寫css，就要加上<style></style>標簽纯路，如果需要增加js或油，需要加上<script></script>標簽。
其實這里解決這個問題主要是增加了兩部分代碼：
filter: progid:DXImageTransform.Microsoft.gradient(startcolorstr=#7F000000,endcolorstr=#7F000000);
background: url(about:blank);
background: url(about:blank);
這種寫法也可以用在輪播圖的分頁器上驰唬，在IE8下顶岸，點擊分頁器很有可能會點到輪播圖片上，加上它就好啦~
ok~結束叫编， 這就是我解決這個問題的辦法辖佣。如果有人有更好的辦法也可以來交流一下呀~ 希望能學到更好的寫法。
把自己遇到的bug寫下來能搓逾，能幫到其他人更好卷谈，幫不到的話，就當給自己警示了~避免以后再犯同樣的錯誤霞篡。
僅供參考世蔗，不喜勿噴，轉載不用注明出處朗兵，給錢就行（說的好像有人真要轉一樣 =_=）
