2010-11-18 3 views
0

私はSoundclickから私の音楽ウェブサイトにフラッシュミュージックプレーヤーを埋め込みました。私はプレーヤーが置かれる固定されたスペースを持っています。問題は、サイトが提供する選手が大きすぎるということです。フラッシュプレーヤーの下部が表示されるだけです。オーバーフローを使用してこれを非表示にする方法はありますか?方法? 「:隠されたオーバーフロー;」CSSを使用してFlashオブジェクトの特定の部分を非表示にする方法は?

を私はdivのコンテナに埋め込みコードを配置し、使用:私はこれまで試したどのような

固定幅と高さを設定します。部分的に機能しますが、上半分のみを表示します。下半分はプレイリストとボタンが配置されている場所なので役に立たない。

<img style="visibility:hidden;width:0px;height:0px;" border=0 width=0 height=0 src="http://counters.gigya.com/wildfire/IMP/CXNID=2000002.0NXC/bT*xJmx*PTEyOTAwNzA2MzY3MzkmcHQ9MTI5MDA3MTMwNTU4NyZwPTE1ODM2MSZkPSZnPTEmbz*5ZWIxNmMyMWQ5NmQ*YWJlODYy/YzdlMmM4NmM4NzMwNCZvZj*w.gif" /><div style="width:300px; height:450px; overflow:hidden;"><center><div><embed src="http://www.soundclick.com/widgets/creatives/mp3PlayerPremium.swf" width="300" height="430" flashvars="bandid=650303&ext=1" name="MP3PlayerPremium" type="application/x-shockwave-flash" wmode="transparent" pluginspage="http://www.macromedia.com/go/getflashplayer" /></div><div style="width: 300px; position: relative; top: -390px;"><a href="http://www.soundclick.com/bands/default.cfm?bandID=650303"><img src="http://www.soundclick.com/images/navigation/blank1x1.gif" border="0" width="300" height="250"></a> </div></center></div> 

答えて

2

私はあなたが何度も説明し、常に少し罪悪を感じていた技術を使用しました。

しかし、私は継続的に最も簡単で確実な方法は、私の埋め込み機能をラップしていることを見つけます私は、上の幅と高さを制限DIVに(ウィジェットが使用することができるものは何でも、JS、インラインフレームから生成された)。最後にオブジェクトをプルアップし、視界の外に負のマージンを使用。

#container { 
    width:475px; 
    height:65px; 
    overflow:none; 
} 
#container embed { 
    margin-top:-85px; 
    margin-left:-145px; 
} 

私はそれを見つけます私のオブジェクトがどこにあるのかを知る最も簡単な方法と、時にはウィジェットのような便利な方法は流体幅(100%)を持っていて、私たちの側面を引き出す負のマージン左右の動きは非常にうまくいくので、インターフェイス開発者にとっては気になることがあるポジショニングを気にする必要はありません。

(私は常にFacebookのlikeboxのためにこれを行う - あなたはearmilk.comの右上に見ることができるように)

+1

+1罪悪感を容認し、人々を離れて位置決めしてから例を挙げてください:) – danjah

+0

ここにコードを埋め込みます。 – Notch

+0

これは本当にありがとうございました。私は今でもこのスタッフの新人です。埋め込み用に別のクラスを用意する必要があるかどうかはわかりませんでした。 – Notch

2

おそらく試してみてください。

#flash_object_container { 
    position:relative; 
} 
#flash_object { 
    position:absolute; 
    bottom:0; 
} 

これはあなたのオーバーフローと明示的な高さと組み合わせてお使いの容器内部のボトムアップからのフラッシュオブジェクトは、それを修正する必要がレンダリングされます。

編集(あなたがコードを提供してきたように):その後、

<div style="width:300px; height:450px; overflow:hidden; **position:relative;**"> 

と::

<div style="width:300px; height:450px; overflow:hidden;"> 

に変更することができ

<div> <embed src="http://www.soundclick.com/widgets/creatives/mp3PlayerPremium.swf" width="300" height="430" flashvars="bandid=650303&ext=1" name="MP3PlayerPremium" type="application/x-shockwave-flash" wmode="transparent" pluginspage="http://www.macromedia.com/go/getflashplayer" /> </div> 

は次のようになります。

<div **style="position:absolute; top:-YOUR_PX_VALUE;"**> <embed src="http://www.soundclick.com/widgets/creatives/mp3PlayerPremium.swf" width="300" height="430" flashvars="bandid=650303&ext=1" name="MP3PlayerPremium" type="application/x-shockwave-flash" wmode="transparent" pluginspage="http://www.macromedia.com/go/getflashplayer" /> </div> 
+0

私の答えよりも優れたソリューションを提供します。 – edeverett

+0

実際には、両方の答えが同じように便利だと思います:) –

0

試した方法で、負の先頭番号を使ってフラッシュオブジェクトを配置してみてください。 (top="-50px;"または何でもあなたが必要とする。

関連する問題