Firefox와 IE에서 버튼이 보이지 않음

이상한 문제가 있습니다. 내 웹 사이트에 Facebook Like Button을 추가하려고하지만 Internet Explorer와 Firefox에는 표시되지 않습니다. 예, 이미 추가했습니다 :Firefox와 IE에서 버튼이 보이지 않음

<html xmlns:fb="http://ogp.me/ns/fb#">

및 FB-Root 및 JS SDK. XFBML 또는 HTML5 버전을 추가하려고 할 때마다 항상 IE 및 Firefox에 표시되지 않습니다. Chrome과 Safari에서는 잘 작동합니다.

그러나 마우스 위로 마우스를 가져 가면 FB와 비슷한 상자가 포함 된 div이 표시된 단추에 커서를 놓으면 올바르게 표시됩니다. 또한,이 버튼을 내 사이트의 다른 위치에 넣으면 표시됩니다. 파이어 폭스와 IE는 페이지를로드의 시작이 상자를 렌더링 것 같은

<li id="menu-item-21" class="ikonka menu-item menu-item-type-custom menu-item-object-custom menu-item-21"> 
<a href="#"><span class="fb ikoneczka"></span> 
<div class="box_pop"> 
<p>Text</p><hr/> 
<div class="fb-like" data-href="http://facebook.com/facebook" data-send="false" data-layout="button_count" data-width="150" data-show-faces="false"></div> 
</div> 
</a> 
</li>

것 같습니다 :

여기에 코드입니다. 그러나, 그들은 그들을 위해 공간을 남겨 둡니다. 이상해.

내가 도와 주시면 좋겠습니다. 미리 감사드립니다.

출처

2012-12-28 Adam W

IE 및 FireFox 브라우저가 최신 버전입니까? – JOpuckman

예, 분명히 있습니다. –

나는 box_pop을 'display : block;'으로 남겨두면 IE에 나타날 것입니다. 흥미 롭 군. –

그래,이 문제에 대한 해결책을 찾았습니다.

먼저, 내 CSS 파일의 모든 Z- 색인을 지우고 z-index: 8;을 .box_pop으로 설정했습니다.

두 번째로 .ikonka div을 display: none;으로 설정하고 .ikonka:hover div을 남겨 둡니다 (CSS로 넣지 마세요).

셋째, 좀 jQuery를 설정 한 :

<script> 
$(document).ready(function() { 
$('#your-li-id').hover(function() { 
$(this).addClass('pretty-hover'); 
}, function() { 
$(this).removeClass('pretty-hover'); 
}); 

}); 
</script>

참고 : 여기서 #your-li-id 당신이 여기 li 요소의 ID를 넣어해야합니다. 이 스크립트는 li에 pretty-hover 클래스를 추가합니다. 그런 다음 CSS에 다음을 입력하십시오.

.pretty-hover div{ 
    display: block; 
}

이제는 작동합니다. 또한 CSS를 통해 - - 당신이 볼 수 있듯이

, 당신은 그런 다음 CSS에 display: none;를 설정하지합니다 단지 호버에 display: block;를 추가합니다.

이렇게하면 iFrame이 IE 나 심지어 FF에도 표시되지 않습니다. jQuery를 사용하여이 트릭을 수행해야한다.

출처

2012-12-29 14:10:56

파이어 폭스 (v.29.0.1)에서 동일한 문제가 있었으며 AdBlock plus (v.2.6)가 렌더링에서 Like 및 Share 버튼을 차단했다.

출처

2014-05-22 10:01:33 silverchair

Firefox와 IE에서 버튼이 보이지 않음

답변

관련 문제