2008-09-23 13 views
9

जिस साइट पर मैं काम कर रहा हूं वह फ़्लैश हेडर है (उन्हें एम्बेड करने के लिए swfobject का उपयोग करके)। अब मुझे कुछ एचटीएमएल में कोड करना होगा जो फ्लैश मूवी को ओवरलैप करना है।मैं फ्लैश मूवी के ऊपर HTML सामग्री कैसे रखूं?

मैंने फ्लैश तत्व के कंटेनर और (बिल्कुल स्थित) div पर z-index सेट करने का प्रयास किया है, लेकिन यह फ्लैश मूवी के पीछे "गायब हो रहा है"।

मैं एक सीएसएस समाधान की उम्मीद कर रहा हूं, लेकिन यदि कोई जेएस जादू है जो चाल करेगा, तो मैं इसके लिए तैयार हूं।

अद्यतन: धन्यवाद, "पारदर्शी" में wmode को अधिकतर सेट करने के लिए धन्यवाद। केवल सफारी/मैक ने अभी भी पहले शो पर फ्लैश के पीछे div छुपाया था। जब मैं किसी अन्य ऐप पर स्विच करता हूं और पीछे आता हूं तो यह सामने होगा। मैं div की प्रारंभिक शैलियों को display: none; पर सेट करके इसे ठीक करने में सक्षम था और पृष्ठ लोड होने के बाद इसे एक सेकंड के बाद जेएस आधे के माध्यम से दृश्यमान बना सकता हूं।

+0

आप एक साथ, एक काम उदाहरण रखा जा सकी क्योंकि मैं एक ही समस्या है और यह कर सकते हैं यह काम करने के लिए नहीं मिलता है, यह देखना अच्छा लगेगा कि यह मेरा या मेरा ब्राउज़र है .. – svinto

उत्तर

20

यकीन FlashVar "wmode" पर सेट है करने के लिए "पारदर्शी" या "केवल अपारदर्शी," लेकिन नहीं डिफ़ॉल्ट, "विंडोड" ... तो आप सीएसएस z- सूचकांक का उपयोग करने में सक्षम होना चाहिए

+1

wmode दक्षिण अमेरिका के गहरे जंगलों में दफन की गई सुनहरी मूर्ति की तरह है। मुझे याद है कि मैंने पहली बार उत्साहित था जब मैंने इसके बारे में सुना था। –

+1

बस ध्यान रखें कि यह फ्लैश 10 के बीटा और हाल ही के ब्राउज़र (एफएक्स 3.0.0+, ओपेरा 9 के अलावा लिनक्स ब्राउज़र के साथ काम नहीं करता है।50+, दूसरों के बारे में नहीं जानते) –

+3

कितने लिनक्स उपयोगकर्ता अपने ब्राउज़र और संबंधित प्रोग्राम अद्यतित नहीं रखते हैं? यह एक समझदार परिभाषा जनसांख्यिकीय है। –

4

अनुवर्ती अप नोट: जैसा कि आपने अपने अपडेट में पाया है, फ्लैश के शीर्ष पर प्रदर्शित करने के लिए एचटीएमएल प्राप्त करना वर्तमान में एक जटिल प्रस्ताव है, और यहां तक ​​कि जेएस जादू के साथ आपको यह भी उम्मीद करनी चाहिए कि फ्लैश ऑफ-ब्राउजर का उपयोग करके कुछ दर्शकों के लिए फ्लैश आपके एचटीएमएल को अवरुद्ध कर देगा , पुराने संस्करण, और इतने पर।

यदि मनमाने ढंग से बड़े ब्राउजिंग ऑडियंस तक पहुंचना आपके लिए महत्वपूर्ण है (उदाहरण के लिए मोबाइल डिवाइस), फिर ओवरलैप से बचने के लिए अपनी सामग्री को फिर से डिजाइन करना आपको लंबे समय तक सिरदर्द बचा सकता है।

+0

आप बिल्कुल सही है। इस मामले में ग्राहक परवाह नहीं है लेकिन यह सामान्य रूप से अच्छी सलाह है। – Lasar

+0

हालांकि, इस मामले में अन्य सवाल यह है कि कितने मोबाइल डिवाइस फ्लैश का समर्थन करते हैं? आईफोन, मुझे यकीन है, शायद कुछ विंडोज मोबाइल स्मार्टफोन, लेकिन उसके बाद? (भी, मैं मोबाइल वेब देव में अच्छी तरह से ज्ञात नहीं हूं, इसलिए मुझे वास्तव में पता नहीं है ...) –

+0

स्टीव: इसे हड़ताल करें, इसे उलट दें! अधिकांश आधुनिक स्मार्टफोन फ्लैश का समर्थन करते हैं, आईफोन को छोड़कर, जो नहीं करता है। विशेष रूप से, अधिकांश आधुनिक फोन (यानी वेब ब्राउज़र वाले) में फ्लैश लाइट होता है, आमतौर पर संस्करण 2.x या 3.x। फ्लैश लाइट 2.x मोटे तौर पर फ्लैश 6 के समान है, और लाइट 3.x फ्लैश 8 के समान है। – fenomas

0

सेट इस

s1.addParam("wmode","transparent"); 
div टैग प्रयोग में

तो इस शैली

style="z-index:inherit; 

समस्या हल हो जाएगा की तरह इस फ़्लैश चर।

0

तरह स्टीव पाउलो ने कहा, तो मज़ा हिस्सा जब एचटीएमएल कि आपके फ्लैश के शीर्ष पर बैठी है और अधिक फ़्लैश बुला रहा है ... आता

ओह मज़ा हम चाहते हैं कि एक, z- की स्थापना शामिल है जिसके साथ था इंडेक्स वास्तव में फ्लैश के लिए खाते में कम होना चाहिए क्योंकि यह मधुमक्खी घुटनों है और इसलिए हमेशा शीर्ष पर होना चाहिए।

1

मैं जोड़ना चाहता हूं, आपको OBJECT और EMBED टैग दोनों में WMODE पैरामीटर ("पारदर्शी") सेट करना याद रखना होगा!

जानकारी के लिए लिंक का पालन करें: शैली का अनुसरण में http://kb2.adobe.com/cps/142/tn_14201.html

1

उपयोग कोड, यह फ़ायरफ़ॉक्स और क्रोम में काम करता है

<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>