J'ai un bouton facebook (édition iFrame) qui est superposé à une application Flash complète du navigateur. Le bouton "J'aime" est accroché pour ressembler à des images distinctes dans l'application, et quand chaque nouvelle image est affichée, le bouton "J'aime" est actualisé avec des données en utilisant ExternalInterface.Problème avec le bouton Facebook Like de Windows Firefox
Le bouton "J'aime" apparaît et disparaît pour chaque nouvelle image en utilisant JQuery fadeIn()/fadeOut(), à nouveau appelé avec ExternalInterface.
La question que je vais avoir est que sur Windows, cela ne semble pas vouloir travailler, dans Firefox spécifiquement ...
CSS:
html {
height: 100%;
overflow: hidden;
min-width: 800px;
min-height: 600px;
}
#flashContent {
position: absolute;
top: 0px;
left: 0px;
height: 100%;
width: 100%;
z-index: 1;
}
body {
margin: 0;
padding: 0;
background-color: #000000;
}
#fb-like {
position: absolute;
bottom: 32px;
left: 510px;
width: 280px;
z-index: 9999;
display: none;
}
fb-like est le div contenant l'iFrame, et son z-index est 9999 juste pour s'assurer qu'il est toujours au top.
Voici le JS utilisé:
<script type="text/javascript">
var isVisible = false;
function showLikeButton(visible){
if(visible == true)
{
$('#fb-like').fadeIn('slow');
isVisible = true;
}
else if (isVisible)
{
$('#fb-like').fadeOut('slow');
isVisible = false;
}
}
var begOfUrl = "http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fmywebsite.com%2fdirectory";
var endOfUrl = "&layout=button_count&show_faces=false&width=150&action=like&colorscheme=dark&height=21";
function sendIdToLikeButton(title, id){
$('#facebook-like').attr('src', begOfUrl + "%3Fid=" + id + endOfUrl);
}
</script>
où la méthode sendIdToLikeButton prend l'identifiant de la photo envoyée par Flash à l'aide ExternalInterface pour recréer l'attribut src de l'iFrame.
Et bien sûr, car cela est une application flash, voici le code HTML minimal:
<body>
<div id="fb-like">
<iframe src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fnfb.designaxiom.com/build13&layout=button_count&show_faces=false&width=150&action=like&colorscheme=dark&height=21" scrolling="no" frameborder="0" style="position: absolute; border:none; overflow:hidden; width:300px; height:40px;" allowTransparency="true" id="facebook-like"></iframe>
</div>
<div id="flashContent">
<a href="http://www.adobe.com/go/getflashplayer">
<img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" />
</a>
</div>
</body>
Encore une fois, cela fonctionne partout sauf pour Firefox sous Windows, et je ne suis pas sûr de ce qu'il faut faire à ce sujet . Je suppose que c'est une erreur dans le CSS ou le Javascript quelque part.
Toute aide est grandement appréciée.
Merci d'avance.
Grammaire