web-dev-qa-db-fra.com

événement onclick javascript sur un objet flash

J'ai un film flash intégré dans une div, j'ai mis un gestionnaire d'événement javascript onclick dans la div principale, mais n'attrape pas le clic, qu'est-ce qui ne va pas?

Code:

   <div id="top-box-player" onclick="alert('Hi Bananas!');">
     <object width="400" height="300">
        <param name="movie" value="general.swf">
        <embed src="./swf/general.swf" width="400" height="300">
        </embed>
     </object>
   </div>
35
Pedro

Il est préférable de considérer tous les swf comme ayant un ordre z de l'infini. Le flash est au-dessus et il y a très peu de choses à faire pour arrêter cela. D'un autre côté, si vous avez accès au code du SWF lui-même, ou si vous pouvez utiliser un autre swf pour charger votre swf actuel, vous pourrez utiliser quelques commandes Flash différentes pour adresser le JavaScript de la page . (ExternalInterface est votre meilleur pari).

//This is what your AS code should look like:
import flash.external.ExternalInterface;
import flash.events.MouseEvent;

root.addEventListener( MouseEvent.CLICK, useExternal, true );

function useExternal( event:MouseEvent):void
{
    //swfClickFunction is defined in JavaScript
    ExternalInterface.call( "swfClickFunction" );
}

Une autre solution alternative utilisant onmousedown au lieu d'onclick est fournie par Darwin ci-dessous.

21
cwallenpoole

J'ai trouvé cela sur http://progproblems.blogspot.com/2009/08/javascript-onclick-for-flash-embeded.html

  1. Définissez le paramètre wmode sur transparent. Cela permet à l'objet contenant le flash de recevoir le javascript onclick.
  2. Utilisez onmousedown au lieu de onclick. Malgré l'utilisation de wmodetransparent, certains navigateurs n'appellent toujours pas onclick, mais ils appellent onmousedown.

Le code ressemble à ceci:

<div onmousedown="clickBanner(1)">
<object>
<param name="movie" value="3.swf">
<param name="wmode" value="transparent" />
<embed wmode=transparent allowfullscreen="true" allowscriptaccess="always" src="3.swf"></embed>
</object>
</div>

Cela fonctionne pour mes besoins =)

86
Darwin

Essayez cette solution facile. Couvrez le flash avec div et placez l'événement click sur le div supérieur pour que le flash n'attrape jamais la souris.

<div style="position:absolute;top:209px;left:80px;z-index:500;" id="helpvideos"> 
<div style="float:left">
<fb:swf 
    swfbgcolor="FFFFFF"  
    swfsrc='<?php echo SITE_URL;?>swf/3_sidebar.swf'  
    width='600' height='670'
    wmode="transparent"
     />
</div>
<div style="width:600px;height:670px;position:absolute;float:left;z-index:6000;" onclick="document.getElementById('helpvideos').setStyle('display','none');">&nbsp;</div>
</div>
2
Tahir

Le flash ne propage presque certainement pas l'événement click à son parent. Vous ne pouvez rien faire à moins d'avoir écrit le flash, je suppose.

2
Tor Haugen

l'objet flash attrapera toujours le clic et ne le passera pas automatiquement. vous devrez construire cette fonctionnalité - attraper onclick en flash et appeler la fonction JS.

qu'est-ce que vous essayez d'accomplir?

2
oberhamsi
<param name="wmode" value="transparent" />

C'était la solution pour moi. Eh bien, je l'ai implémenté sur AC_RunActiveContent.js au niveau des paramètres:

'wmode', 'transparent',

Agréable!!!

1
Yagarasu

faire un événement onclick sur une balise object. (la balise d'objet prend en charge les événements de souris). puis saisissez le div parent via DOM.

1
Elijan Sejic

J'ai eu ce problème lorsque j'ai essayé de créer des bannières automatisées à placement dynamique. Si SWF était réglé sur le mode "opaquecolor", je n'avais aucun clic acceptable - et j'ai dû utiliser opaquecolor parce que certaines bannières étaient gâchées avec les couleurs des sites Web. La solution que j'ai trouvée, est de mettre le SWF en mode "transparent", à une <div> de z-index: 10, et de placer en dessous une nouvelle <div> de mêmes dimensions du fichier SWF, remplie de la couleur opaque de le SWF. Les deux divs en une balise <a>. Ça a marché.

Example:
    <a href="www.mysite.com">
    <div id="SWF_file_container" style="width:100px; height:40px; z-index:10;">
    <object> .... </object> (adding SWF in TRANSPARENT MODE)
    </div>
    <div id="opaquecolor_of_swf" style="width:100px; height:40px; z-index:2; background-color:#ff0000;"></div>
    </a>
1
vkp