2010-01-22 5 views
15

Je veux faire en sorte que lorsque je clique n'importe où sur l'élément Flash incorporé, cela m'amène à une URL de destination.Ajouter un lien autour d'un fichier Flash incorporé

Voici mon code actuel, qui ne produit pas l'effet désiré: il est

<div class="contentdiv" style="margin:-72px 0 10px 0px; cursor:pointer;" onclick="location.href='http://example.com/';"> 

<object height="410" width="720"> 
<param name="movie" value="images/tri.swf"> 
<embed src="images/tri.swf" height="400" width="700"> 
</embed> 
</object> 

</div> 

En ce moment, fait l'espace derrière le cliquable fichier .swf pour le lien, mais l'élément Flash n'est pas cliquable.

Si la bonne chose à faire est d'éditer le fichier .swf en quelque sorte, s'il vous plaît faites le moi savoir. Je ne me considère pas comme un développeur Flash, mais y a-t-il des ressources sur où commencer ou comment faire quelque chose de basique avec un fichier .swf existant?

Toutes les suggestions sont très appréciées!

Répondre

6

Mise à jour après plus de recherche:

Cette question a été posée, et le best answer est que vous devez créer le lien dans le flash.

Habituellement, cela est fait de manière dynamique en passant un paramètre (classiquement appelé clickTAG) au fichier .swf pour lui indiquer où lier.

Dans votre cas (puisque quelqu'un d'autre a fourni vos fichiers swf) Je peux voir 2 options:

  1. Votre auteur .swf peut-être déjà mis en œuvre le clickTAG method (vous pouvez leur demander, ou tout simplement l'essayer sur le .swf pour voir si cela fonctionne.)
  2. Vous pourriez faire un fichier de wrapper flash qui implémente clickTag, et le faire charger et afficher votre fichier .swf. Je sais que cela ressemble à un hack, mais je ne vois pas d'autres alternatives.

Espérons que cela aide!


J'ai aussi vu quelque chose comme ça utilisé [edit: mais je n'arrive pas à le faire fonctionner! Googler suggère qu'il est impossible]

<a href="http://example.com/" target="_blank"> 
<object height="410" width="720"><param name="movie" value="images/tri.swf"> 
<embed src="images/tri.swf" height="400" width="700"></embed> 
</object> 
</a> 

(Par exemple here)

+1

J'ai essayé d'implémenter ceci et cela n'a pas fonctionné. En outre, votre lien va à une page de forum qui semble non liée à ce sujet. – JWM

+0

Le lien est à une page avec une bannière publicitaire flash: regardez la source de la page pour voir comment ils l'ont fait! –

3

Mettez un .gif ou .png transparent sur le flash en utilisant z-index et l'ancre à cette image transparente avec votre URL.

14

J'ai eu le même problème, trouvé ce fil, mais j'ai fini par créer ma propre solution.

I ajouté élément transparent sur le lien, puis fait chevaucher le swf embeded

<a href="http://example.com/" target="_blank"> 
    <object height="410" width="720"><param name="movie" value="http://www.theslap.com/swf/slap_logo.swf"> 
    <embed src="http://www.theslap.com/swf/slap_logo.swf" height="400" width="700"></embed> 
    </object> 
    <i style="display:block; height: 410px; width: 720px; position: relative; z-index: 9; margin-top: -410px;"></i> 
</a> 

Remarque - vous devriez probablement inclure le code CSS dans un fichier séparé pour le code de production.

+0

Merci, c'est ce que j'ai fait, sauf que j'ai utilisé un 'div' au lieu d'un' i' tag, et j'ai utilisé 'top' au lieu de' margin-top' dans la balise de style. Semble faire exactement ce que j'ai besoin de faire. Merci encore. – James

+0

J'ai aussi dû changer le mode Flash de la fenêtre en opaque en ajoutant ceci à l'intérieur de la balise object "' et cet attribut de la balise embed 'wmode =" opaque "'. –

1

Vous pouvez créer votre propre swf (ou demander à quelqu'un de le faire pour vous) d'avoir un bouton éditable avec FlashVars sur la scène et qui charge le sujet swf sous ce bouton.

J'en ai créé un pour vous: Download.

Vous avez juste besoin d'ajouter deux FlashVars lorsque vous incorporez:

  1. url - L'URL qui sera visité si le swf est cliqué.
  2. swf - Le fichier SWF à charger.
0
<div id="logo" > 
    <div id="linklogo" style="position:absolute;"><a href="http://www.gogle.com"><img src="transparent.png"></a></div> 
    <div id="flashlogo" > 
    <object type='application/x-shockwave-flash' data='1.swf' width='200' height='86'>  <param name='flashvars' value='clickTag=&clickTarget=_self' /><param name='allowScriptAccess' value='always' /><param name='movie' value='1.swf' /><param name="wmode" value="transparent"></object> 
</div> 

certainement élimine le problème dans tous les cas

1

Je me suis fâché de résoudre le problème .... J'ai essayé plusieurs trucs dont jquery et javascript.

Certainement la SOLUTION qui fonctionne et fonctionne dans TOUS les navigateurs est celle au-dessus de ma réponse.

Merci utilisateur user2628529

  <div class="containe"> 
       <div style="position:absolute;"> <a href="http://www.sample.com" target="_blank" > <img src="http://www.sample.it/banner/trasparent-190-505.png"> </a> </div> 
       <div > 
       <object type='application/x-shockwave-flash' data='http://www.sample.it/banner/banner-one.swf' width='190' height='505'> 
        <param name='flashvars' value='clickTag=&clickTarget=_self' /> 
        <param name='allowScriptAccess' value='always' /> 
        <param name='movie' value='banner-one.swf' /> 
        <param name='wmode' value='transparent' > 
       </object> 
       </div> 
      </div> 
+0

vous n'avez pas besoin du png. un simple div vide (avec la même dimension) fonctionne aussi pour moi. Mais merci quand même! – xxxbence

1

Il y a une meilleure façon que j'ai trouvé

<div class="flash-wrap"> 
    <a class="flash-link" href="#"></a> 
    <object type="application/x-shockwave-flash" data="flash.swf" width="180" height="220"> 
     <param name="wmode" value="opaque"> 
     <param name="movie" value="flash.swf" /> 
     <param name="quality" value="high" /> 
    </object> 
</div> 

 

.flash-wrap{ 
     position: relative; 
     } 

     .flash-link{ 
     position: absolute; top:0px; left:0px; 
     width:180px; /*Flash Size*/ 
     height:220px; 
     /*background: url('images/0.gif') no-repeat;*/ /*You should uncommented this line for support old IE version.*/ 
     } 

https://gist.github.com/m-pokrovskii/6558817

0

Cela a fonctionné pour moi:

<a target="_blank" href="{{ entity.link }}"> 
    <object type="application/x-shockwave-flash" data="{{ entity.file.path }}?clickTAG={{ entity.link }}" width="120" height="600" style="visibility: visible;"> 
     <param name="quality" value="high"> 
     <param name="play" value="true"> 
     <param name="LOOP" value="false"> 
     <param name="wmode" value="transparent"> 
     <param name="allowScriptAccess" value="true"> 
    </object> 
</a> 
0

Merci! maintenant. Il a travaillé

<div style="width: 400px; height: 100px;"> 
    <a href="http://www.sample.com" target="_blank"> 
    <object height="100" width="400"><param name="movie" value="1.swf"> 
     <embed src="1.swf" quality="high" type="application/x-shockwave-flash" wmode="transparent" width="400" height="100" pluginspage="http://www.macromedia.com/go/getflashplayer" allowScriptAccess="always"></embed> 
    </object> 
     <i style="display: block; height: 100px; width: 400px; position: relative;z-index: 9;margin-top: -102px;"></i> 
    </a> 
</div> 
0

Vous ne pouvez pas ajouter un lien vers un objet flash, mais vous pouvez superposer une image transparente avec un lien, sur l'objet flash. Ceci est mon exemple:

<div style="position: relative;"> 
     <div style="position: absolute; 
     left: 250px; 
     top: 0px; 
     z-index: 9999;"> 
      <a href="http://terrazasmedicina.com.ar/hometerrazas.html"> 
<img src="logoLinkTR.png" width="504" height="103"></a> 
     </div> 
     <script type="text/javascript"> 
    AC_FL_RunContent('codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0','width','1024','height','106','src','banner','quality','high','pluginspage','http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash','movie','banner'); //end AC code 
    </script></div> 

Dans mon cas, l'objet est embeded par un script, mais il devrait fonctionner de la même chose.
Vous avez à envelopper dans un div par rapport l'objet et une div avec l'image, puis position absolue la div avec l'image en l'alignant par gauche, en haut, les propriétés droite et en bas et asigning Propriété z-index pour chevaucher l'image.

Questions connexes