【问题标题】:How to put flash content over the html even if the flash is not即使没有 Flash,如何将 Flash 内容放在 html 上
【发布时间】:2011-01-20 16:52:00
【问题描述】:

因此,如果您以 MySpace 为例 (http://www.myspace.com/sonidolalimpia),您现在会看到徽标在您将鼠标悬停时具有非常有趣的效果,他们是如何做到的?

【问题讨论】:

  • 该网站的 Flash 内容似乎非常有限。您确定不想要 CSS 信息吗?
  • 我发现鼠标悬停效果只在主页 (myspace.com) 左上角的标志处描述(需要一段时间才能加载,请尝试将鼠标上下移动几次)
  • 我猜它是 Flash、JavaScript 和 HTML/CSS 的组合,其中徽标图像覆盖有 Flash 动画,一旦 swf 文件完全加载,swf 文件如下:cms.myspacecdn.com/cms/x/11/3/eyeplant.swf

标签: html flash


【解决方案1】:

正如已经写过的,所有技巧都不是在 Flash 中,而是在 css 和 jQuery 中。他们使用 jQuery onMouseOver 事件,简单地用透明的 flash 切换标志的图片版本。

之前

<h2>    
    <a href="/" class="MSIcon MSLogo" id="msStaticLogo" style="left: 0pt;">
        Myspace
    </a>
</h2>   

<div id="flashLogoContainer">
    <a href="/">
    <span id="logoInTrigger">   
    Myspace 
    </span>
    </a>
    <object width="354" height="475" type="application/x-shockwave-flash"
            data="http://cms.myspacecdn.com/cms/x/11/3/bag.swf" id="msFlashLogos" 
        style="visibility: visible; top: -28px; left: -9999px;">
    <param name="quality" value="high">
    <param name="wmode" value="transparent">
    <param name="bgcolor" value="transparent">
    <param name="allowscriptaccess" value="always">
    </object>
    <span class="MSIcon beta" id="beta">Beta</span>
    <div id="leftLogoTrigger" style="display: none;"></div>
    <div id="rightLogoTrigger" style="display: none;"></div>    
    <div id="bottomLogoTrigger" style="display: none;"></div>   
</div>
</li>

之后

 <li class="logo">
<h2>    
    <a href="/" class="MSIcon MSLogo" id="msStaticLogo" style="left: -9999px;">
        Myspace
    </a>
</h2>   

<div id="flashLogoContainer">
    <a href="/">
    <span id="logoInTrigger">   
    Myspace 
    </span>
    </a>
    <object width="354" height="475" type="application/x-shockwave-flash"
            data="http://cms.myspacecdn.com/cms/x/11/3/bag.swf" id="msFlashLogos"
        style="visibility: visible; top: -28px; left: -120px;">
    <param name="quality" value="high">
    <param name="wmode" value="transparent">
    <param name="bgcolor" value="transparent">
    <param name="allowscriptaccess" value="always">
    </object>
    <span class="MSIcon beta" id="beta">Beta</span>
    <div id="leftLogoTrigger" style="display: block;"></div>
    <div id="rightLogoTrigger" style="display: block;"></div>   
    <div id="bottomLogoTrigger" style="display: block;"></div>  
</div>
</li>

【讨论】:

    猜你喜欢
    • 2010-10-09
    • 2010-09-12
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-04-04
    • 2012-07-15
    • 2011-08-19
    • 2013-04-25
    相关资源
    最近更新 更多