Question

我的代码工作得很好。它在html页面上调用javascript脚本，它在页面上绘制并制作动画。现在，我现在所做的是添加标签以自动播放音频剪辑。我的问题是我的动画停止绘制，但背景中有音乐播放。

下面的

是我用来运行的index.html。它是项目中唯一的html文件。

<!doctype html> 
<html class="no-js" lang="en" manifest="./main.manifest">
    <head>
        <meta charset="utf-8">

        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

        <title> My Game </title>
        <meta name="description" content="">
        <meta name="author" content="SweetPotatoes">

        <meta name = "viewport" content = "user-scalable=no,
        initial-scale=1.0, maximum-scale=1.0, width=device-width" />


        <link rel="stylesheet" href="css/style.css">
        <link rel="stylesheet" href="css/game.css">
        <meta name="apple-mobile-web-app-capable" content="yes" />
        <meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1">


    </head>

    <body>


        <div id="container">
            <canvas id="canvasSausage" display="block" ></canvas>
        </div>
            <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
        <script>
            window.jQuery || document.write('<script src="js/libs/jquery-1.6.2.min.js"><\/script>')
        </script>




<!-- JavaScript at the bottom for fast page loading -->

            <script src="js/libs/modernizr-2.0.6.min.js"></script>
            <script src="js/libs/require.1.0.8.min.js"></script>
            <script src="js/libs/Draw.js"></script>
            <script src="js/libs/Smile.js"></script>
            <script src="js/libs/UpDpwn.js"></script>
            <script src="js/mylibs/SmellyCanvas/core/canvasMain.js"></script>

            <!-- scripts concatenated and minified via ant build script-->
            <script defer src="js/plugins.js"></script>
            <script defer src="js/script.js"></script>

            <!-- end scripts-->

            <script>
                window._gaq = [['_setAccount', 'UAXXXXXXXX1'], ['_trackPageview'], ['_trackPageLoadTime']];
                Modernizr.load({
                    load : ('https:' == location.protocol ? '//ssl' : '//www') + '.google-analytics.com/ga.js'
                });
            </script>

            <!-- Prompt IE 6 users to install Chrome Frame. Remove this if you want to support IE 6.
            chromium.org/developers/how-tos/chrome-frame-getting-started -->
            <!--[if lt IE 7 ]>
            <script src="//ajax.googleapis.com/ajax/libs/chrome-frame/1.0.3/CFInstall.min.js"></script>
            <script>window.attachEvent('onload',function(){CFInstall.check({mode:'overlay'})})</script>
            <![endif]-->
            <audio autoplay="true">
            <source src="sound/Heart.mp3"></source>
                audio tag not supported.
            </audio>

        </body>
    </html>

my main.manifest

CACHE MANIFEST
# 2012-08-11

index.html
sound/Heart.mp3

Answer 1

在开发过程中不要使用清单。清单就像对类固醇的浏览器缓存一样。更改外部.js文件然后让浏览器没有抓住它们有足够的问题，因为您使用的浏览器保存的版本（当某些内容被破坏/不同时）。

使用清单，您几乎可以将缓存功能扩展到永恒，除非您要编写脚本来管理清单。总而言之：不要。

构建您要构建的内容，以及何时完成 - 至少，当它处于1.0阶段时，或者是一个好的，可靠的，公共测试版...

...然后开始考虑在清单中永久缓存文件。

canvas不使用HTML5使用音频标记绘制

1 个答案: