L'appel de javascript à partir des balises d'ancrage sifr remplacées?

J'utilise sIFR pour remplacer mon texte de navigation avec une nouvelle police:L'appel de javascript à partir des balises d'ancrage sifr remplacées?

<ul> 
    <li><a href="#">about</a></li> 
    <li><a href="#">reel</a></li> 
    <li><a href="#">contact</a></li> 
    <li><a href="#">archive</a></li> 
    <li><a href="#">login</a></li> 
</ul>

sIFR.replace(futura, { 
    css: [ 
     '.sIFR-root { background-color:transparent; color: #999999; cursor:pointer; font-size:26px; text-transform:uppercase; }', 
     'a { color: #999999; text-decoration:none; }', 
     'a:hover { color: #CCCCCC; text-decoration:none; }' 
    ], 
    fitExactly:true, 
    forceClear:true, 
    forceSingleLine:true, 
    selector: '#navigation ul li', 
    transparent:true 
});

Cela fonctionne très bien. Je puis essayer d'ajouter des actions à la navigation à l'aide jQuery:

$(document).ready(function(){ 
    $("#navigation ul li a").click(function(event){ 
     event.preventDefault(); 
     alert("nav clicked"); 
    }); 
});

Ces actions ne semblent pas fonctionner bien parce que les balises d'ancrage sont masqués par sIFR lorsque le contenu est remplacé. Comment ajouter du code jQuery aux tags remplacés? Je préfère ne pas faire quelque chose comme ce qui suit (et laisser javascript être appelé à partir de Flash) car il va à l'encontre sorte de tout l'objet de javascript discret:

<a href="javascript:gotoSection('about');">about</a>

Modifier (HTML généré):

<ul> 
    <li style="" class="sIFR-replaced"><object width="88" height="37" class="sIFR-flash" type="application/x-shockwave-flash" id="sIFR_replacement_0" name="sIFR_replacement_0" data="/swf/bfuturah.swf" style=""><param name="flashvars" value="id=sIFR_replacement_0&amp;content=%253Ca%2520href%253D%2522/home/about%2522%2520target%253D%2522%2522%253EABOUT%253C/a%253E&amp;width=55&amp;renderheight=37&amp;link=/home/about&amp;target=&amp;size=26&amp;css=.sIFR-root%257Bcolor%253A%2523999999%253B%257Da%257Bcolor%253A%2523999999%253Btext-decoration%253Anone%253B%257Da%253Ahover%257Bcolor%253A%2523CCCCCC%253Btext-decoration%253Anone%253B%257D&amp;cursor=pointer&amp;tunewidth=0&amp;tuneheight=0&amp;offsetleft=&amp;offsettop=&amp;fitexactly=true&amp;preventwrap=false&amp;forcesingleline=true&amp;antialiastype=&amp;thickness=&amp;sharpness=&amp;kerning=&amp;gridfittype=pixel&amp;flashfilters=&amp;opacity=100&amp;blendmode=&amp;selectable=true&amp;fixhover=true&amp;events=false&amp;delayrun=false&amp;version=436"/><param name="wmode" value="transparent"/><param name="bgcolor" value="transparent"/><param name="allowScriptAccess" value="always"/><param name="quality" value="best"/></object><span class="sIFR-alternate" id="sIFR_replacement_0_alternate"><a href="/home/about">about</a></span></li> 
    <li style="" class="sIFR-replaced"><object width="58" height="37" class="sIFR-flash" type="application/x-shockwave-flash" id="sIFR_replacement_1" name="sIFR_replacement_1" data="/swf/bfuturah.swf" style=""><param name="flashvars" value="id=sIFR_replacement_1&amp;content=%253Ca%2520href%253D%2522/home/reel%2522%2520target%253D%2522%2522%253EREEL%253C/a%253E&amp;width=42&amp;renderheight=37&amp;link=/home/reel&amp;target=&amp;size=26&amp;css=.sIFR-root%257Bcolor%253A%2523999999%253B%257Da%257Bcolor%253A%2523999999%253Btext-decoration%253Anone%253B%257Da%253Ahover%257Bcolor%253A%2523CCCCCC%253Btext-decoration%253Anone%253B%257D&amp;cursor=pointer&amp;tunewidth=0&amp;tuneheight=0&amp;offsetleft=&amp;offsettop=&amp;fitexactly=true&amp;preventwrap=false&amp;forcesingleline=true&amp;antialiastype=&amp;thickness=&amp;sharpness=&amp;kerning=&amp;gridfittype=pixel&amp;flashfilters=&amp;opacity=100&amp;blendmode=&amp;selectable=true&amp;fixhover=true&amp;events=false&amp;delayrun=false&amp;version=436"/><param name="wmode" value="transparent"/><param name="bgcolor" value="transparent"/><param name="allowScriptAccess" value="always"/><param name="quality" value="best"/></object><span class="sIFR-alternate" id="sIFR_replacement_1_alternate"><a href="/home/reel">reel</a></span></li> 
    <li style="" class="sIFR-replaced"><object width="116" height="37" class="sIFR-flash" type="application/x-shockwave-flash" id="sIFR_replacement_2" name="sIFR_replacement_2" data="/swf/bfuturah.swf" style=""><param name="flashvars" value="id=sIFR_replacement_2&amp;content=%253Ca%2520href%253D%2522/home/contact%2522%2520target%253D%2522%2522%253ECONTACT%253C/a%253E&amp;width=76&amp;renderheight=37&amp;link=/home/contact&amp;target=&amp;size=26&amp;css=.sIFR-root%257Bcolor%253A%2523999999%253B%257Da%257Bcolor%253A%2523999999%253Btext-decoration%253Anone%253B%257Da%253Ahover%257Bcolor%253A%2523CCCCCC%253Btext-decoration%253Anone%253B%257D&amp;cursor=pointer&amp;tunewidth=0&amp;tuneheight=0&amp;offsetleft=&amp;offsettop=&amp;fitexactly=true&amp;preventwrap=false&amp;forcesingleline=true&amp;antialiastype=&amp;thickness=&amp;sharpness=&amp;kerning=&amp;gridfittype=pixel&amp;flashfilters=&amp;opacity=100&amp;blendmode=&amp;selectable=true&amp;fixhover=true&amp;events=false&amp;delayrun=false&amp;version=436"/><param name="wmode" value="transparent"/><param name="bgcolor" value="transparent"/><param name="allowScriptAccess" value="always"/><param name="quality" value="best"/></object><span class="sIFR-alternate" id="sIFR_replacement_2_alternate"><a href="/home/contact">contact</a></span></li> 
    <li style="" class="sIFR-replaced"><object width="110" height="37" class="sIFR-flash" type="application/x-shockwave-flash" id="sIFR_replacement_3" name="sIFR_replacement_3" data="/swf/bfuturah.swf" style=""><param name="flashvars" value="id=sIFR_replacement_3&amp;content=%253Ca%2520href%253D%2522/archive%2522%2520target%253D%2522%2522%253EARCHIVE%253C/a%253E&amp;width=72&amp;renderheight=37&amp;link=/archive&amp;target=&amp;size=26&amp;css=.sIFR-root%257Bcolor%253A%2523999999%253B%257Da%257Bcolor%253A%2523999999%253Btext-decoration%253Anone%253B%257Da%253Ahover%257Bcolor%253A%2523CCCCCC%253Btext-decoration%253Anone%253B%257D&amp;cursor=pointer&amp;tunewidth=0&amp;tuneheight=0&amp;offsetleft=&amp;offsettop=&amp;fitexactly=true&amp;preventwrap=false&amp;forcesingleline=true&amp;antialiastype=&amp;thickness=&amp;sharpness=&amp;kerning=&amp;gridfittype=pixel&amp;flashfilters=&amp;opacity=100&amp;blendmode=&amp;selectable=true&amp;fixhover=true&amp;events=false&amp;delayrun=false&amp;version=436"/><param name="wmode" value="transparent"/><param name="bgcolor" value="transparent"/><param name="allowScriptAccess" value="always"/><param name="quality" value="best"/></object><span class="sIFR-alternate" id="sIFR_replacement_3_alternate"><a href="/archive">archive</a></span></li> 
<a href="/archive"> </a><li style="" class="sIFR-replaced"><object width="80" height="37" class="sIFR-flash" type="application/x-shockwave-flash" id="sIFR_replacement_4" name="sIFR_replacement_4" data="/swf/bfuturah.swf" style=""><param name="flashvars" value="id=sIFR_replacement_4&amp;content=%253Ca%2520href%253D%2522/login%2522%2520target%253D%2522%2522%253ELOGIN%253C/a%253E&amp;width=50&amp;renderheight=37&amp;link=/login&amp;target=&amp;size=26&amp;css=.sIFR-root%257Bcolor%253A%2523999999%253B%257Da%257Bcolor%253A%2523999999%253Btext-decoration%253Anone%253B%257Da%253Ahover%257Bcolor%253A%2523CCCCCC%253Btext-decoration%253Anone%253B%257D&amp;cursor=pointer&amp;tunewidth=0&amp;tuneheight=0&amp;offsetleft=&amp;offsettop=&amp;fitexactly=true&amp;preventwrap=false&amp;forcesingleline=true&amp;antialiastype=&amp;thickness=&amp;sharpness=&amp;kerning=&amp;gridfittype=pixel&amp;flashfilters=&amp;opacity=100&amp;blendmode=&amp;selectable=true&amp;fixhover=true&amp;events=false&amp;delayrun=false&amp;version=436"/><param name="wmode" value="transparent"/><param name="bgcolor" value="transparent"/><param name="allowScriptAccess" value="always"/><param name="quality" value="best"/></object><span class="sIFR-alternate" id="sIFR_replacement_4_alternate"><a href="/login">login</a></span></li> 
</ul>

Source

2009-07-03 typeoneerror

Selon 626595 et 801642, l'événement de clic n'est pas propagé. Si vous utilisez sIFR 3, il y a un rappel onRelease que vous pouvez passer en sIFR.replace(), qui reçoit un objet FlashInteractor. De là, vous pouvez utiliser getAncestor() pour accéder à l'élément remplacé. Donc, votre code ressemblera probablement à ce qui suit. (ce qui n'a pas été testé par moi)

sIFR.replace(futura, { 
    /* the rest of your replace params */ 
    selector: '#navigation ul li', 
    transparent:true, 
    onRelease: function(fi) { liClick(fi.getAncestor()); } 
}); 

function liClick(li) { 
    var $li = $(li), 
     $a = $(li).find('a'); 
    //$li points at a jQuery'd list item 
    //$a points at the original anchor 
}

Mark Wubben answer dans this forum post a été très instructif pour et onRelease

Source

2009-07-04 07:06:04

de Nice! Cela aide beaucoup. Y at-il un moyen d'annuler l'action par défaut de la balise d'ancrage then (event.preventDefault ou return false) dans ce contexte? – typeoneerror

Pour être honnête, je ne suis pas tout à fait sûr, je n'ai pas utilisé sIFR avec des liens avant. Il y a quelques rappels pratiques sur http://wiki.novemberborn.net/sifr3/JavaScript%2BMethods - modifyContentString ou modifyContent pourraient probablement être utilisés pour remplacer les liens par des spans avant que sIFR ne les utilise, de cette façon ils ne finiront pas comme éléments de navigation dans le film. Ça vaut le coup :-) –

Avez-vous essayé d'utiliser la méthode .live? Live method docs

$("#navigation ul li a").live('click', function(e){ 
//Code here 
});

Il est peut-être un cas de piratage un peu, peut-être ajouter les événements aux éléments remplacés .sifr. Je n'ai pas utilisé sifr depuis un moment alors ma mémoire est un peu rouillée sur ce qu'il insère.

Peut-être publier un échantillon du code HTML généré.

Espérons que cela aide.

Source

2009-07-04 00:44:21 Nooshu

L'appel de javascript à partir des balises d'ancrage sifr remplacées?

Répondre

Questions connexes