FBML, sichtbar zu Verbindung, sonst, zusätzlicher Leerraum

Question

Auf Facebook können Sie mit dem FBML-Box-Add-On eine Registerkarte erstellen, die benutzerdefinierten Code enthält. Sie können beispielsweise Inhalte von Personen ausblenden, die Sie nicht mögen, und Inhalte sofort anzeigen, sobald sie auf die Schaltfläche "Gefällt mir" klicken. Dies wird über diesen Code getan:

<fb:visible-to-connection> 
    <div class="fan">Content for fans</div> 
<fb:else> 
    <div class="no-fan">Content for non-fans</div> 
</fb:else> 
</fb:visible-to-connection> 

Das Problem ist, dass Facebook eine Sichtbarkeit gilt: um versteckte Inhalte verborgen, was bedeutet, dass der Inhalt ist weg, aber der weiße Raum bleibt. Sie können den oberen Rand von .no-fan auf einen negativen Wert setzen, der den Inhalt nach oben bewegt und somit den Leerraum versteckt. Dies funktioniert im Allgemeinen sehr gut. Es funktioniert tatsächlich einwandfrei Wenn die Höhe des Inhalts von. Fan ist gleich. No-Fan. In meinem Fall sind sie nicht. Mein .fan Inhalt ist länger und wenn sie uns "mögen", wird das untere Bild abgeschnitten (auf .fan). Es scheint das Überlaufen zu tun: versteckt, nimmt die Höhe des .no-Fan-Inhalts. Wenn ich die Höhe des .fan-Inhalts erzwinge, wird alles enthüllt, aber dann, wenn du kein Fan bist, gibt es Leerraum über dem .no-Fan-Inhalt. Ich habe verschiedene Kombinationen aus Polsterungen und Höhenübungen ausprobiert, aber es gibt immer eine Inkonsistenz.

Hat jemand dieses Problem gehabt? Was hast du getan, um es zu lösen? Selbst wenn Sie noch nie mit FBML gearbeitet haben, was wäre ein anderer logischer Ansatz?

Danke, Ryan

Answer 1

OK, nach einer weiteren Stunde damit, habe ich herausgefunden, was das Problem ist.

Angenommen, mein Faninhalt ist 100px groß und mein Nicht-Faninhalt ist 75px groß. Wenn Facebook den Nicht-Fan-Inhalt lädt, wird ein Bereich um das Ganze gelegt, wobei overflow: hidden eines der Inline-Stil-Attribute ist. Wenn du die Seite "magst", schaltet sie auf den Fan-Inhalt um, aber die Höhe des DIV mit overflow: hidden wird nicht aktualisiert, was bedeutet, dass 25px meines Fan-Inhalts abgeschnitten werden.

Die Lösung bestand darin, den Nicht-Lüfter-Inhalt auf 100px Höhe zu bringen, sodass während des Umschaltens zum Lüfter der gesamte Lüfterinhalt angezeigt werden konnte. Der Nachteil ist, dass es etwas mehr Platz unterhalb des Nicht-Fan-Inhalts gibt, aber es ist jenseits des Inhalts, den Besucher interessieren. Zumindest gibt es keinen weißen Bereich über meinem Inhalt und alle meine Inhalte sind zu 100% der Zeit sichtbar.

Das ist die Lösung, die ich gefunden habe, wenn jemand Empfehlungen hat oder etwas, das ich ausprobieren kann, würde ich mich über Feedback freuen.

-Ryan

Answer 2

hatte ich dieses gleiche weiße Raum Thema in der facebook wie Box, aber es wurde durch die Definition Höhe gelöst. hast du das probiert?

Answer 3

Sie müssen diesen Code auf hinzuzufügen:

<style> 
#wrapper { 
width:520px; 
margin:0 auto; border:0; padding:0; 
position:relative; 
} 
#non-fans { 
width:520px; 
position:absolute; top:0; left:0; 
} 
</style>