1

我的代码运行良好。它在 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>

我的主要清单

CACHE MANIFEST
# 2012-08-11

index.html
sound/Heart.mp3
4

1 回答 1

1

不要在开发时使用清单。清单就像类固醇上的浏览器缓存。对外部 .js 文件进行更改然后让浏览器不抓取它们存在足够多的问题，因为您使用的是浏览器从以前的访问中保存的版本（当某些东西被破坏/不同时）。

使用清单，您几乎可以将缓存能力扩展到永恒，除非您要编写脚本来管理清单。一句话：不要。

构建你将要构建的东西，以及何时完成——至少，当它处于 1.0 阶段，或者是一个好的、可靠的公开测试版时……

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

于 2012-08-17T04:42:18.090 回答