facebook - ボックスストリームの高さのようなFacebook

Question

ボックスストリーム部分の高さだけでFacebookのように制御する方法。ボックス全体の高さを下げるのが普通ですが、それを制御しようとすると、ファンの画像は表示されません。

css .fan_box .page_stream{ ...,width:300px}to.fan_box .page_stream{...,width:150px}

iframe内のストリームボックスが原因で質問しています

Answer 1

高さを変える方法はありません。Facebook は高さを変更する方法を提供しておらず、JavaScript と CSS を使用して高さを変更する方法もありません。

JavaScript と CSS でできないのはなぜですか?

CSS は、iFrame がどのように機能するかという理由で、iFrame を介して適用されません。基本的には、独自の CSS を持つ別のページへのウィンドウです。

iFrame の URL が iFrame を含むページと異なる場合、Javascript では iFrame のコンテンツにアクセスできません。やっている：

document.getElementById('iframeID').contentWindow.document

Chrome で次の警告が表示されます。

Unsafe JavaScript attempt to access frame with URL... Domains, protocols and ports must match.

これは XSS を防止するためです。Same Origin Policyの詳細については、こちらをご覧ください。

Answer 2

囲んでいる div の高さを減らし、そのオーバーフローを非表示にし、その上部をより高い z-index を持つ絶対配置要素の下にプッシュする場合は、次のようにします。

<div style="position:absolute;z-index:2;top:0;left:0;width:300px;height:130px;background-color:#c0c;opacity:0.5;filter:alpha(opacity=50);-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";"></div>
<div style="height:140px;width:140px;overflow:hidden;background-color:#0c0; margin-top: 60px;color: #fff;padding: 30px;font-family:arial;">
    facebook like box goes here - only the green part will be visible if you make the pink box white and take out the 0.5 opacity and the bottom will get cut off so you can just display whatever part you want
</div>

Answer 3

Like Box ページでこれを見て、'data-height' 属性を使用できると回答したいと思いました。

data-height="250"

私のために働いた。これが私の例です：

http://www.skonet.com/Resources/Articles/Index.aspx

Answer 4

はい、外側のiframeを減らすため、データの高さを250にすると機能します

ここで、data-height を 1000 に設定してみてください - 高さは300pxのままですが、

iframe 内の内部 div が 300px にハードコードされており、クロス ドメイン iframe にあるため、それを制御できないためです...

Answer 5

<div class="fb-like-box" data-href="http://www.facebook.com/example" data-width="292" data-height="250" data-show-faces="true" data-stream="false" data-header="false"></div>

heightこのコードのを、自分に最適なものに調整します。