我正在使用sIFR将我的导航文本替换为新字体:
<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
});
这很好用。我正在尝试使用jQuery向导航添加一些操作:
$(document).ready(function(){
$("#navigation ul li a").click(function(event){
event.preventDefault();
alert("nav clicked");
});
});
这些操作似乎不起作用,因为更换内容时sIFR会隐藏锚标记。如何为替换标签添加一些jQuery代码?我宁愿不做类似下面的事情(并让我们从Flash调用javascript),因为它有点打败了不引人注目的javascript的整个目的:
<a href="javascript:gotoSection('about');">about</a>
修改(生成的HTML):
<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&content=%253Ca%2520href%253D%2522/home/about%2522%2520target%253D%2522%2522%253EABOUT%253C/a%253E&width=55&renderheight=37&link=/home/about&target=&size=26&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&cursor=pointer&tunewidth=0&tuneheight=0&offsetleft=&offsettop=&fitexactly=true&preventwrap=false&forcesingleline=true&antialiastype=&thickness=&sharpness=&kerning=&gridfittype=pixel&flashfilters=&opacity=100&blendmode=&selectable=true&fixhover=true&events=false&delayrun=false&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&content=%253Ca%2520href%253D%2522/home/reel%2522%2520target%253D%2522%2522%253EREEL%253C/a%253E&width=42&renderheight=37&link=/home/reel&target=&size=26&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&cursor=pointer&tunewidth=0&tuneheight=0&offsetleft=&offsettop=&fitexactly=true&preventwrap=false&forcesingleline=true&antialiastype=&thickness=&sharpness=&kerning=&gridfittype=pixel&flashfilters=&opacity=100&blendmode=&selectable=true&fixhover=true&events=false&delayrun=false&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&content=%253Ca%2520href%253D%2522/home/contact%2522%2520target%253D%2522%2522%253ECONTACT%253C/a%253E&width=76&renderheight=37&link=/home/contact&target=&size=26&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&cursor=pointer&tunewidth=0&tuneheight=0&offsetleft=&offsettop=&fitexactly=true&preventwrap=false&forcesingleline=true&antialiastype=&thickness=&sharpness=&kerning=&gridfittype=pixel&flashfilters=&opacity=100&blendmode=&selectable=true&fixhover=true&events=false&delayrun=false&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&content=%253Ca%2520href%253D%2522/archive%2522%2520target%253D%2522%2522%253EARCHIVE%253C/a%253E&width=72&renderheight=37&link=/archive&target=&size=26&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&cursor=pointer&tunewidth=0&tuneheight=0&offsetleft=&offsettop=&fitexactly=true&preventwrap=false&forcesingleline=true&antialiastype=&thickness=&sharpness=&kerning=&gridfittype=pixel&flashfilters=&opacity=100&blendmode=&selectable=true&fixhover=true&events=false&delayrun=false&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&content=%253Ca%2520href%253D%2522/login%2522%2520target%253D%2522%2522%253ELOGIN%253C/a%253E&width=50&renderheight=37&link=/login&target=&size=26&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&cursor=pointer&tunewidth=0&tuneheight=0&offsetleft=&offsettop=&fitexactly=true&preventwrap=false&forcesingleline=true&antialiastype=&thickness=&sharpness=&kerning=&gridfittype=pixel&flashfilters=&opacity=100&blendmode=&selectable=true&fixhover=true&events=false&delayrun=false&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>
答案 0 :(得分:2)
根据626595和801642,点击事件不会传播出去。如果您使用的是sIFR 3,则可以将onRelease回调传递到sIFR.replace()
,并获得FlashInteractor个对象。从那里,您可以使用getAncestor()
来访问被替换的元素。
因此,您的代码可能类似于以下内容。 (这是我未经测试的)
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
}
非常有启发性
答案 1 :(得分:0)
您是否尝试过使用.live方法? Live method docs
$("#navigation ul li a").live('click', function(e){
//Code here
});
可能是一个黑客攻击的情况,可能会将事件添加到.sifr替换元素中。我有一段时间没有使用过sifr所以我的内存在它插入的内容上有点生疏。
也许发布生成的HTML样本。
希望有所帮助。