2008-09-23 12 views
9

Üzerinde çalıştığım bir sitede Flash üstbilgileri var (bunları gömmek için swfobject kullanıyor). Şimdi Flash filminin üst üste gelmesi gereken bir HTML kodunu yazmam gerekiyor.HTML içeriğini bir Flash filmin üzerine nasıl yerleştiririm?

Flash öğesinin kapsayıcısına ve (kesinlikle konumlandırılmış) div'a z-endeksini ayarlamayı denedim ancak Flash filminin arkasında "kayboluyor".

Bir CSS çözümü olmasını umuyoruz, ancak hile yapacak biraz sihir varsa, bunun için hazırım.

Güncelleme: Wmode'un "saydam" a ayarlanması çoğunlukla düzeltildi. Sadece Safari/Mac ilk gösterimde flaşın ardındaki divayı sakladı. Başka bir uygulamaya geçtiğimde ve ön tarafta olurdu. Bunu, div'un ilk stillerini display: none; olarak ayarlayarak ve sayfa yüklendikten sonra bir saniye sonra JS aracılığıyla görünür hale getirebildim.

+0

Eğer ben aynı sorun var ve çünkü can, birlikte bir çalışma örneği koyabilir misiniz Firefox ve krom çalışır bu beni ya da benim tarayıcı eğer 't işe almak, bu görmek güzel olurdu .. – svinto

cevap

20

FlashVar'ın "wmode" den "şeffaf" ya da belirlendiğinden emin olun "opak" ama DEĞİL varsayılan, "pencereli" ... o zaman CSS z-index kullanmak mümkün olmalıdır

+1

wmode Güney Amerika'da en derin ormanlarda gömülü bir altın put gibidir. Hatırlıyorum, ilk duyduğumda kendinden geçmiştim. –

+1

Sadece Flaş 10'un beta ve çok yeni tarayıcılarda (Fx 3.0.0+, Opera 9 hariç Linux tarayıcıları ile çalışmıyor unutmayın.50+, başkaları hakkında bilmiyorum) –

+3

Kaç Linux kullanıcısı tarayıcılarını ve ilişkili programları güncel tutmuyor? Bu anlayışlı bir demografik. –

4

takibe up not: Güncellemenizde bulduğunuz gibi, Flash'ın üzerinde görüntülenecek HTML'yi almak şu anda çok iyi bir teklif niteliğindedir ve bulduğunuz JS büyüsüyle Flash'ın tarayıcıları kullanarak bazı görüntüleyenler için HTML'nizi engelleyeceğini düşünmeniz gerekir. , eski sürümler vb.

bir keyfi büyük tarama hedef kitleye ulaşma (örneğin, mobil cihazlar) sizin için önemli ise

, daha sonra uzun vadede baş ağrısı kaydedebilir çakışmasını önlemek için içeriğinizi yeniden tasarlama. div etiketi kullanımda o zaman bu

s1.addParam("wmode","transparent"); 

sorun çözülecektir

style="z-index:inherit; 

Bu stilin nasıl

+0

You Elbette haklısın. Bu durumda müşteri umursamıyor ama genel olarak sağlam bir tavsiye. – Lasar

+0

Bu durumda diğer soru, kaç mobil cihaz Flash'ı destekliyor? IPhone, eminim, belki de Windows Mobile akıllı telefonlarından bazıları, ama bundan sonra? (Ayrıca, mobil web devresinde de iyi değilim, bu yüzden gerçekten bilmiyorum ...) –

+0

Steve: grev, tersine çevir! Çoğu modern akıllı telefon, iPhone hariç, Flash'ı desteklemektedir. Spesifik olarak, çoğu modern telefon (ör. Web tarayıcıları olanlar), genellikle 2.x veya 3.x sürümleri olan Flash Lite'a sahiptir. Flash Lite 2.x, Flash 6'ya kabaca benzer ve Lite 3.x, Flash 8'e benzer. – fenomas

0

Seti bu flash değişkeni.

0

gibi Steve Paulo ardından flaş üstüne oturuyor HTML fazla flaş çağırıyor eğlenceli kısım ... gelir, söz konusu

Ah biz Z- ayarı içerdiğini biriyle eğlendik indeksi aslında daha düşük olmak için düşünmek için daha düşük olduğu düşünüldüğünde arılar dizleridir ve bu nedenle her zaman en üstte olmalıdır.

1

Ayrıca, her iki OBJECT ve EMBED etiketlerinde WMODE parametrelerini ("şeffaf") ayarlamak için unutmayın!

detaylar için bağlantıyı takip edin: stilini aşağıdaki http://kb2.adobe.com/cps/142/tn_14201.html

1

kullanımlık kod, bu

<object id='myId' width='700' height='500'> 
      <param name='movie' value='images/ann/$imagename' /> 
      <param name='wmode' value='transparent' /> 
      <!--[if !IE]>--> 
      <object type='application/x-shockwave-flash' data='images/ann/$imagename' width='700' height='500' wmode='transparent'> 
      <!--<![endif]--> 
      <div> 
       <h1>Please download flash player</h1> 
       <p><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></p> 
      </div> 
      <!--[if !IE]>--> 
      </object> 
      <!--<![endif]--> 
     </object>