2010-07-21 9 views
7

पर्यावरण: विंडोज 7, इंटरनेट एक्सप्लोरर 8, फ़्लैश ActiveX 10.1.53.64, wmode = पारदर्शीघटना कुछ ब्राउज़रों में बुदबुदाती नहीं जब फ्लैश पर क्लिक किया

बस एक छोटा सा परीक्षण पृष्ठ है कि आप में लोड कर सकते हैं लिखा था आईई और फ़ायरफ़ॉक्स या कोई अन्य ब्राउज़र।

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
    <title>Event bubbling test</title> 
    </head> 
    <body onclick="alert('body');" style="margin:0;border-width:0;padding:0;background-color:#00FF00;"> 
    <div onclick="alert('div');" style="margin:0;border-width:0;padding:0;background-color:#FF0000;"> 
     <span onclick="alert('span');" style="margin:0;border-width:0;padding:0;background-color:#0000FF;"> 
     <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://fpdownload.macromedia.com/get/shockwave/cabs/flash/swflash.cab#version=7,0,0,0" width="159" height="91" id="flashAbout_small" align="absmiddle"> 
      <param name="movie" value="http://www.adobe.com/swf/software/flash/about/flashAbout_info_small.swf"/> 
      <param name="quality" value="high"/> 
      <param name="bgcolor" value="#FFFFFF"/> 
      <param name="wmode" value="transparent"/> 
      <embed src="http://www.adobe.com/swf/software/flash/about/flashAbout_info_small.swf" quality="high" bgcolor="#FFFFFF" width="159" height="91" wmode="transparent" name="flashAbout_small" align="absmiddle" type="application/x-shockwave-flash" pluginspage="http://www.adobe.com/go/getflashplayer"/> 
     </object> 
     </span> 
    </div> 
    </body> 
</html> 

इसलिए किसी भी रंग का आकार एक चेतावनी का उत्पादन करना चाहिए पर क्लिक (आईई में हरे रंग की एक, यकीन नहीं के लिए छोड़कर क्यों, लेकिन मुझे आशा है कि विषय बंद है और मेरी समस्या से संबंधित नहीं)।

फ़ायरफ़ॉक्स में फ़्लैश कंटेनर पर क्लिक करना पूरी तरह से ठीक काम करेगा। आपको इस क्रम में अलर्ट बॉक्स प्राप्त करना चाहिए: अवधि, div और body। फ्लैश घटना को एचटीएमएल पर बुलबुला करता है। लेकिन यह आईई में नहीं हो रहा है।

तो आईई में फ्लैश क्यों एचटीएमएल पर घटनाओं को बुलबुला नहीं कर रहा है?

संपादित करें: एंडी ई द्वारा उल्लिखित अनुसार यह व्यवहार Google क्रोम में भी देखा जा सकता है, जो कि मेरा ज्ञान पृष्ठ में फ्लैश मूवी को एम्बेड करने के लिए ActiveX का उपयोग नहीं कर रहा है।

उत्तर

3

इंटरनेट एक्सप्लोरर में फ्लैश एक ActiveX नियंत्रण है - ActiveX नियंत्रण घटनाओं का उपभोग करता है लेकिन उन्हें होस्ट करने वाले ऑब्जेक्ट तत्व पर उन्हें आग नहीं लगाता है। इसका मतलब है कि बुलबुला करने के लिए कोई डोम घटना नहीं है। एफडब्ल्यूआईडब्ल्यू, Google क्रोम वैसे ही व्यवहार करता है।

+0

उनका कहना है कि प्लग में गूगल क्रोम में एक ही तरह से व्यवहार कर रहा है के लिए धन्यवाद। –

0

कुछ माउसवेन्ट प्रकारों के फ्लैश को सूचित करने के लिए बस कॉलबैक फ़ंक्शन पर ..
फिर आप वहां से आंतरिक रूप से बबल कर सकते हैं।

+1

समाधान को एक शुद्ध HTML जावास्क्रिप्ट समाधान होना आवश्यक है क्योंकि आप हमेशा फ्लैश या ऑब्जेक्ट को नियंत्रित नहीं करते हैं। –

1

इस समस्या का मेरा समाधान फ्लैश ऑब्जेक्ट को पूर्ण करने और माउस पर क्लिक करने वाले समान आकार के स्पैन तत्व को स्थानांतरित करना था।

<span style="display:block;position:absolute;z-Index:2; background:url(/img/x.gif) repeat;width: 159px; height: 91px;"></span> 
<object style="position:absolute;z-Index:1" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://fpdownload.macromedia.com/get/shockwave/cabs/flash/swflash.cab#version=7,0,0,0" width="159" height="91" id="flashAbout_small" align="absmiddle"> 
      <param name="movie" value="http://www.adobe.com/swf/software/flash/about/flashAbout_info_small.swf"/> 
      <param name="quality" value="high"/> 
      <param name="bgcolor" value="#FFFFFF"/> 
      <param name="wmode" value="transparent"/> 
      <embed src="http://www.adobe.com/swf/software/flash/about/flashAbout_info_small.swf" quality="high" bgcolor="#FFFFFF" width="159" height="91" wmode="transparent" name="flashAbout_small" align="absmiddle" type="application/x-shockwave-flash" pluginspage="http://www.adobe.com/go/getflashplayer"/> 
</object> 

ओवरले की (पारदर्शी) पृष्ठभूमि छवि के बिना यह काम नहीं करेगा।

2

हम इस समस्या के साथ काफी परेशान थे और आखिरकार सरल समाधान में आए।

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

संपादित करें: अपनी खुद की जरूरतों के लिए इसे अपडेट किया गया है अब अपने ही लोगों enableclickthrough के एक वर्ग है या उस वर्ग

// When a mouse up occurs on an embed or a holder element taged with class enableclickthrough, then hide the element and refire the click 
$(document).ready(function(){ 
    $('body').mouseup(function (event) { 
     var offset = $(this).offset(), 
      clientX = event.clientX, 
      clientY = event.clientY, 
      left = offset.left, 
      top = offset.top, 
      x = clientX - left, 
      y = clientY - top, 
      target = $(event.target), 
      display = $(target).css('display'), 
      passClickTo; 

     if (typeof clientX != 'undefined' && (target.parent().hasClass('enableclickthrough') || target.hasClass('enableclickthrough'))) { 
      target.css('display', 'none'); 
      // If you don't pull it out of the array for some reason it doesn't work in all instances 
      passClickTo = $(document.elementFromPoint(x, y)); 
      passClickTo[0].click(); 
      target.css('display', display); 
      return false; 
     } 
    }); 
}); 

यहाँ वाले एक तत्व की बच्चे हैं कि एक फ्लैश का एक उदाहरण - तो कोड क्या फ्लैश फिल्मों के माध्यम से क्लिक किया जा सकता है के बारे में अधिक चयनात्मक क्रोम

<div class="enableclickthrough"> 
    <script type="text/javascript"> 
    AC_FL_RunContent([params_for_your_flashmovie_here]); 
    </script> 
</div> 
में एक रैपर तत्व के साथ फिल्म को ठीक से काम करने की अनुमति देने के लिए

ध्यान रखें कि यह समाधान फ़्लैश फिल्मों के लिए है जिसमें उनमें इंटरैक्टिव घटक नहीं हैं।

मुझे आशा है कि इससे फ्लैश मूवीज़ के साथ इस समस्या को अन्य में मदद मिलेगी।

सादर

विल फेरर

संबंधित मुद्दे