画布回退到闪存正在加载图像

Canvas fallback to flash is loading images

本文关键字：闪存 加载 图像 布回退 回退      更新时间：2023-09-26

在我的网站上，我用flash显示广告

我仍然使用flash，因为我的访问者使用不支持html5的旧浏览器

如果用户没有 Flash 支持，我会展示全屏广告

如果用户没有 Flash 支持或没有画布支持，我会向他们展示图像

这是我的代码：

<p>
<object width="728" height="90" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" id="alter-content" align="middle">
    <param value="http://www.bellezaculichi.com/banners/47.swf" name="movie">
    <param name="quality" value="high">
    <param name="bgcolor" value="#ffffff">
    <param name="play" value="true">
    <param name="loop" value="true">
    <param name="wmode" value="window">
    <param name="scale" value="showall">
    <param name="menu" value="false">
    <param name="devicefont" value="false">
    <param name="salign" value="">
    <param name="allowScriptAccess" value="always">
    <!--[if !IE]>-->
    <object data="http://www.bellezaculichi.com/banners/47.swf" width="728" height="90" type="application/x-shockwave-flash">
        <param name="movie" value="http://www.bellezaculichi.com/banners/47.swf">
        <param name="quality" value="high">
        <param name="bgcolor" value="#ffffff">
        <param name="play" value="true">
        <param name="loop" value="true">
        <param name="wmode" value="window">
        <param name="scale" value="showall">
        <param name="menu" value="false">
        <param name="devicefont" value="false">
        <param name="salign" value="">
        <param name="allowScriptAccess" value="always">
        <!--<![endif]-->
        <!-- inicia sin flash -->
        <script>
            window.onload = function() {
                canvasApp();
            }
            function canvasApp() {
                var mi_canvas = document.getElementById("canvas");
                if (!mi_canvas || !mi_canvas.getContext) {
                    return;
                }

                var context = mi_canvas.getContext("2d");
                var pic = new Image();
                pic.src = "./banners/" + 47 + ".jpg";
                pic.addEventListener('load', imagen_cargada, false);
                function imagen_cargada() {
                    dibuja_canvas();
                }

                function dibuja_canvas() {
                    context.drawImage(pic, 0, 0, 728, 90);
                }
                function onMouseClick(e)
                {
                    window.open("http://www.si-net.com.mx/registro.php", '_blank');
                }
                mi_canvas.addEventListener("click", onMouseClick, false);
                dibuja_canvas();
            }
        </script>
        <canvas id="canvas" width="728" height="90" style="cursor:pointer;">
            <!-- si no soporta canvas -->
            <a href="http://www.si-net.com.mx/registro.php" target="_blank" rel="nofollow">
                <img src="./banners/47.jpg" width="728" height="90" border="0">
            </a>
            <!-- si no soporta canvas -->
        </canvas>
        <!-- fin sin flash -->
        <!--[if !IE]>-->
    </object>
    <!--<![endif]-->
</object>
</p>

它有效...

我

使用谷歌浏览器开发人员工具进行测试，我发现使用flash的人加载画布回退中使用的图像

如果用户有 flash，则无需加载画布中使用的图像...

如果用户有 flash，如何避免加载画布中使用的图像？

提前谢谢你

我实现了我想要的。如果用户安装了 Flash，我避免加载画布资源。

这是我的代码：

<object width="900" height="506" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" id="alter-content" align="middle">
<param value="catarina.swf" name="movie" />
<param name="quality" value="high" />
<param name="bgcolor" value="#ffffff" />
<param name="play" value="true" />
<param name="loop" value="true" />
<param name="wmode" value="window" />
<param name="scale" value="showall" />
<param name="menu" value="false" />
<param name="devicefont" value="false" />
<param name="salign" value="" />
<param name="allowScriptAccess" value="sameDomain" />
<!--[if !IE]>-->
<object data="catarina.swf" width="900" height="506" type="application/x-shockwave-flash">
    <param name="movie" value="catarina.swf" />
    <param name="quality" value="high" />
    <param name="bgcolor" value="#ffffff" />
    <param name="play" value="true" />
    <param name="loop" value="true" />
    <param name="wmode" value="window" />
    <param name="scale" value="showall" />
    <param name="menu" value="false" />
    <param name="devicefont" value="false" />
    <param name="salign" value="" />
    <param name="allowScriptAccess" value="sameDomain" />
    <!--<![endif]-->
    <!-- inicia sin flash -->
    <div id="swiffycontainer" style="width: 550px; height: 400px">
    </div>
    <script>
        var hasFlash = false;
        try {
            var fo = new ActiveXObject('ShockwaveFlash.ShockwaveFlash');
            if (fo) {
                hasFlash = true;
            }
        } catch (e) {
            if (navigator.mimeTypes && navigator.mimeTypes['application/x-shockwave-flash'] != undefined && navigator.mimeTypes['application/x-shockwave-flash'].enabledPlugin) {
                hasFlash = true;
            }
        }
        if (hasFlash == false) {

            function load_animacion() {
                var animacion = document.createElement("script");
                animacion.type = "text/javascript";
                animacion.src = "catarina-v02.js";
                document.head.appendChild(animacion);
            }
            function loadSwiffy() {

                var animacion_canvas = document.createElement("script");
                animacion_canvas.type = "text/javascript";
                animacion_canvas.src = "https://www.gstatic.com/swiffy/v7.2.0/runtime.js";
                if (animacion_canvas.readyState) {
                    animacion_canvas.onreadystatechange = function() {
                        if (animacion_canvas.readyState == "loaded" || animacion_canvas.readyState == "complete") {
                            animacion_canvas.onreadystatechange = null;
                            load_animacion();
                        }
                    };
                } else {
                    animacion_canvas.onload = function() {
                        load_animacion();
                    };
                }

                document.head.appendChild(animacion_canvas);
            }

            window.onload = loadSwiffy;
            // carga la libreria de swiffy

        }
    </script>
    <!-- fin sin flash -->
    <!--[if !IE]>-->
</object>
<!--<![endif]-->

如果用户没有 Flash 支持，它会动态加载创建 CANVAS 动画所需的 javascript 代码。

在此示例中，首先加载 SWIFFY 库 （https://www.gstatic.com/swiffy/v7.2.0/runtime.js）

加载库后，加载 js 代码 （catarina-v02.js） 以创建和动画画布

这样，如果用户安装了 Flash，我就避免了加载画布资源。

相关文章：