0

MacのSafariとChromeで次の作業を行っています。PC で Firefox Mac と IE をチェックするように切り替えたところ、動作しません。理由がわかりません!どんな提案も素晴らしいでしょう。

http://davidcool.com/experiments/follow.html

コード:

<!DOCTYPE html>
<html>
<head>
    <title>follow</title>
    <script src=processing-1.4.1.min.js></script>
</head>
<body>
    <div style="width:100%; height:100%; position:absolute; top:50;">
        <canvas data-processing-sources="harmonograph_v2_1_logo.pde" tabindex="0" id="__processing0" width="1300" height="160"></canvas>
    </div>
</body>
</html>

Mike の提案に従って、私はこれを最小限の骨まで取り除きましたが、それでも PC IE や Mac Firefox では動作しません。Chrome と Safari Mac は正常に動作します。firebug がエラーを出していたので、エンコーディングを追加しました。無効。

<!DOCTYPE html>
<html>
<head>
<title>test pjs</title>
    <meta charset='utf-8'>
<script src="processing-1.4.1.min.js"></script>
</head>
<body>
<div>
    <canvas data-processing-sources="harmonograph.pjs"></canvas>
</div>
</body>
</html>

また、コンバーターを作成し、スケッチを .pde ファイルの処理から js .pjs 形式の処理に変換しました: http://generactive.net/tools/pde_to_pjs/convert_to_pjs.html?#

変換されたファイルは、同じ 2 つのブラウザーでも正常に機能します。

さて、この問題の更新。それ以来、スケッチを置き換えましたが、現在は機能しています。つまり、問題はスケッチのどこかにあります。何が問題なのか、なぜそれが一部のブリューワーで機能するのか、他のブリューワーでは機能しないのかはわかりませんが、スケッチの何かが特定のブラウザーを強制終了します. 上記のコードは正常に動作するはずです。

4

1 に答える 1

0

Pjs ライブラリの名前には特殊文字が含まれているため、引用符で囲む必要があります<script src="processing-1.4.1.min.js"></script>。連続した非特殊文字の文字列のみを引用符なしで残すことができるため、属性文字列を引用符で囲むことをお勧めします。

二次的な注意として、ビットは実際には必要ありません。tabindex="0" id="__processing0"これらは Pjs によって自動的に追加されます (自己指定の id 属性を使用している場合は、代わりに実際の名前を付けたほうがよいでしょう)。

最後に<div style="width:100%; height:100%; position:absolute; top:50;">、高さ 100% として設定する html と body の CSS ルールも指定しない限り、高さに関してはあまり効果がありません。基本的に、最初に機能させるために、キャンバスとコンテナーの両方で幅と高さを指定しないことをお勧めします。div が自動調整する必要がある寸法を把握し、キャンバスがpde ファイルsize(...,...)内の関数内の呼び出しからそのサイズを取得できるようにします。setup

于 2013-04-11T00:46:14.180 に答える