臉書喜歡在不透明的IE

我有一段代碼無法正常工作。我的頁面上有一個Facebook小部件，其不透明度爲0.5。當你將鼠標懸停在它上面時，它變得不透明：1.在Chrome，Firefox等一切工作正常。但在IE瀏覽器中，懸停不起作用。小部件停留在0.5不透明度，而不是更改爲1.臉書喜歡在不透明的IE

我希望有人能告訴我爲什麼它不起作用，或許如何讓它在所有瀏覽器中都能正常工作。

<div class="art-layout-cell layout-item-1" style="width: 33%"> 
    <div class="art-widget widget widget_text" id="text-2"> 
     <div class="art-widget-content"> 
      <div class="textwidget"> 
       <div class="fb-like-box fb_iframe_widget" data-href="https://www.facebook.com/Dansvanopstal" data-width="310" data-height="580" height="580" data-colorscheme="light" data-show-faces="true" data-header="false" data-stream="true" data-show-border="false" fb-xfbml-state="rendered" fb-iframe-plugin-query="app_id=230469016992855&amp;color_scheme=light&amp;header=false&amp;height=580&amp;href=https%3A%2F%2Fwww.facebook.com%2FDansvanopstal&amp;locale=nl_NL&amp;sdk=joey&amp;show_border=false&amp;show_faces=true&amp;stream=true&amp;width=310"><span style="vertical-align: bottom; width: 310px; height: 580px;"><iframe name="f11894a138" width="310px" height="580px" frameborder="0" allowtransparency="true" scrolling="no" title="fb:like_box Facebook Social Plugin" src="http://www.facebook.com/plugins/like_box.php?app_id=230469016992855&amp;channel=http%3A%2F%2Fstatic.ak.facebook.com%2Fconnect%2Fxd_arbiter.php%3Fversion%3D28%23cb%3Df2d771f9b4%26domain%3Dwww.mijncreaties.com%26origin%3Dhttp%253A%252F%252Fwww.mijncreaties.com%252Ff1d810dd4%26relation%3Dparent.parent&amp;color_scheme=light&amp;header=false&amp;height=580&amp;href=https%3A%2F%2Fwww.facebook.com%2FDansvanopstal&amp;locale=nl_NL&amp;sdk=joey&amp;show_border=false&amp;show_faces=true&amp;stream=true&amp;width=310" style="border: none; visibility: visible; width: 310px; height: 580px;" class=""></iframe></span></div> 
      </div> 
     </div> 
    </div> 
</div>

的CSS是：

.layout-item-1{ 
    opacity: 0.5; 
    transition: opacity .25s ease-in-out; 
    -moz-transition: opacity .25s ease-in-out; 
    -webkit-transition: opacity .25s ease-in-out; 
    -ms-transition: opacity .25s ease-in-out; 
    -o-transition: opacity .25s ease-in-out; 
} 
.layout-item-1:hover{ 
    opacity: 1; 
    transition: opacity .25s ease-in-out; 
    -moz-transition: opacity .25s ease-in-out; 
    -webkit-transition: opacity .25s ease-in-out; 
    -ms-transition: opacity .25s ease-in-out; 
    -o-transition: opacity .25s ease-in-out; 
}

所以一言以蔽之：當您訪問的頁面在Chrome，火狐等Facebook構件顯示0.5不透明性，但是當你在它懸停，它變成1個不透明度（使其完全可見）。但是，當你訪問IE中的頁面時，Facebook小部件顯示0.5不透明度，當你將鼠標懸停在它上面時，什麼都不會發生。它只是0.5。它應該更改爲1.

當您將鼠標懸停在Facebook DIV旁邊的邊緣（第一個DIV邊緣與Facebook DIV之間的5個像素）時，它確實有效。

看到它在頁面的底部：http://bit.ly/1lMOcMu

來源

2014-01-12 user3170187

不透明度設置爲Internet Explorer：

/* IE 8 */ 
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; 

/* IE 5-7 */ 
filter: alpha(opacity=50);

來源

2014-01-12 20:08:01 artdias90

這不是透明度。這工作正常。這是關於懸停效果無法正常工作。 – user3170187

臉書喜歡在不透明的IE

回答

相關問題