0

Facebook ページのカスタム Facebook サイドバーを作成しました。これは、UL 内の LI タグでメッセージを表示します。

この UL ボックスがページの他のコンテンツよりも長くなりたくないので、最初の 5 つのメッセージを表示するようにしました。

最近、長めのメッセージを投稿するようになったので、5 メッセージが他のコンテンツよりも長くなりました。5 つのメッセージを減らすことができるようになりました。たとえば、3 つのメッセージです。

ただし、これには毎週手動で微調整する必要があり、最適ではありません。

これで、ul に次の css プロパティを持たせました。

.facebooklist{ 高さ:800px; overflow:hidden } ただし、これは最後のメッセージを遮断します。

ボックスの高さが 800px 以上になるまで、ページ メッセージを含むアイテムをできるだけ多く表示したいと考えています。

これは可能ですか?もしそうなら、どのように?

参考までに、こちらの私のページをチェックしてください: 画像

サイドバーは右側にあります。

コード:

<div class = "fbheader"><img class = "flogo" src = "img/f_logo.png"/><a class = "ftext" href="https://www.facebook.com/WIEWIE4life">WIEWIE</a><iframe class ="fiframe" src="//www.facebook.com/plugins/like?href=http%3A%2F%2Fwww.facebook.com%2FWIEWIE4life&amp;send=false&amp;layout=standard&amp;width=10&amp;show_faces=false&amp;font&amp;colorscheme=light&amp;action=like&amp;height=35&amp;appId=520187094675923&amp;locale=en_US" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:50px; height:25px; float:right;" allowTransparency="true"></iframe></div>
                            <ul class = "facebooklist">
                                <?php
                                    $page = file_get_contents('https://graph.facebook.com/WIEWIE4life/feed?access_token=520187094675923|OcGraoxcC7OH7gurPtx9Rqb8KnA');
                                    $data = json_decode($page);
                                    $x = 0;
                                    foreach ($data->data as $news ) {
                                        $StatusID = explode("_", $news->id);
                                        if (!empty($news->message) && !($temp > 5)){
                                            $temp = $temp + 1;
                                ?>
                                            <li class = "bericht">
                                                <?php
                                                    $x = new DateTime($news->updated_time);
                                                    $x->setTimezone(new DateTimeZone('Europe/Amsterdam'));
                                                    $time = $x->format(DATE_ATOM);
                                                    $x = explode("T",$time);
                                                    $x[1] = substr($x[1],0,-9);
                                                    echo "<h6 class = 'date'>". $news->from->name . " - " . $x[0]. " ".$x[1]."</h6>";
                                                ?>
                                <?php
                                                echo "<p class = 'message'>" . $news->message . "</p>";
                                            ?>              
                                            </li>
                                <?php
                                        }
                                    }
                                ?>
                            </ul>
                        </div>

前もって感謝します!

4

2 に答える 2

0

PHP のみに依存するソリューションはおそらく失敗します。これは、コンテンツがどの画面解像度でどのくらいの長さになるか、およびこれらの 10,000 の可能なブラウザー構成の下で実際に知ることができないためです。

したがって、私はJSを使用します。

  • 方法 1: データを配列に保持し、高さがメイン コンテンツの高さを超えない<li>限り、それらを追加します。<ul>
  • 方法 2:<li>既に行ったように php を使用して通常どおりに出力し、コンテンツよりも大きい<li>限り、JS を使用して最後の要素を削除します。<ul>
于 2013-06-18T10:15:35.350 に答える