sIFR动态改变父元素悬停时文本的颜色
我正在使用 sIFR 来设置标题样式,并希望在悬停在父元素上时动态更改文本(在 Flash 影片内)的颜色。
一个人会怎样做呢?有什么例子吗?我从未见过它被完成。
<ul class="tab">
<li id="tab2">
<a href="#two">
<span class="organisation sIFR-replaced" style="">
<object width="300" height="31" class="sIFR-flash" type="application/x-shockwave-flash" id="sIFR_replacement_5" name="sIFR_replacement_5" data="fla/gothamBook.swf" style="">
<param name="flashvars" value="id=sIFR_replacement_5&content=Bureau%2520ICE&width=300&renderheight=31&link=&target=&size=25&css=.sIFR-root%257Bcolor%253A%2523d7d9e3%253Bletter-spacing%253A0.05%253B%257Da%257Btext-decoration%253Anone%253B%257Da%253Alink%257Bcolor%253A%2523d7d9e3%253B%257Da%253Ahover%257Bcolor%253A%2523ffffff%253B%257D&cursor=default&tunewidth=0&tuneheight=0&offsetleft=&offsettop=&fitexactly=false&preventwrap=false&forcesingleline=false&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_5_alternate">Bureau ICE</span>
</span>
</a>
</li>
</ul>
我已经尝试了以下似乎合乎逻辑的方法......但它不起作用。这是我正在努力改变的span.organization!
sIFR.replace(gothamBook, {
wmode: 'transparent',
selector: 'span.organisation'
,css: [
'.sIFR-root { color: #d7d9e3; background-color:#61648a; letter-spacing:0.05; }'
,'a span.organisation { text-decoration: none; }'
,'a:link span.organisation { color: #d7d9e3; }'
,'a:hover span.organisation { color: #ffffff; }'
]
});
I'm using sIFR to style headings and want to dynamically change the color of text (within the flash movie) onhover of parent element.
How would one do this? Any examples? I have never seen it done.
<ul class="tab">
<li id="tab2">
<a href="#two">
<span class="organisation sIFR-replaced" style="">
<object width="300" height="31" class="sIFR-flash" type="application/x-shockwave-flash" id="sIFR_replacement_5" name="sIFR_replacement_5" data="fla/gothamBook.swf" style="">
<param name="flashvars" value="id=sIFR_replacement_5&content=Bureau%2520ICE&width=300&renderheight=31&link=&target=&size=25&css=.sIFR-root%257Bcolor%253A%2523d7d9e3%253Bletter-spacing%253A0.05%253B%257Da%257Btext-decoration%253Anone%253B%257Da%253Alink%257Bcolor%253A%2523d7d9e3%253B%257Da%253Ahover%257Bcolor%253A%2523ffffff%253B%257D&cursor=default&tunewidth=0&tuneheight=0&offsetleft=&offsettop=&fitexactly=false&preventwrap=false&forcesingleline=false&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_5_alternate">Bureau ICE</span>
</span>
</a>
</li>
</ul>
I've tried the following which seems logical... but it doesn't work. It's the span.organisation in the i'm trying to change!
sIFR.replace(gothamBook, {
wmode: 'transparent',
selector: 'span.organisation'
,css: [
'.sIFR-root { color: #d7d9e3; background-color:#61648a; letter-spacing:0.05; }'
,'a span.organisation { text-decoration: none; }'
,'a:link span.organisation { color: #d7d9e3; }'
,'a:hover span.organisation { color: #ffffff; }'
]
});
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
替换
,以便链接最终出现在 Flash 影片中,然后使用
a:hover
作为颜色。css
参数中的选择器与被替换的元素相关,因此span.organization
将不起作用,因为您已经替换了span.organization
>。Replace the
<li>
instead, so the link ends up in the Flash movie, then usea:hover
for the colors.The selectors in the
css
parameter are relative to the replaced element, soa span.organisation
won't work because you've replacedspan.organisation
.