0

I have the following working in Safari & Chrome on a Mac. I just switched over to check Firefox Mac and IE on PC and it's not working. I can't seem to figure out why! Any suggestions would be grand.

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

The code:

<!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>

As per Mike's suggestions, I stripped this down to bare bones and it still doesn't work in PC IE or Mac Firefox. Chrome and Safari Mac work fine. I added in the encoding as firebug was giving me an error. No effect.

<!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>

I also built a converter and converted the sketch from processing .pde file to processing js .pjs format here: http://generactive.net/tools/pde_to_pjs/convert_to_pjs.html?#

The converted files work fine in the same two browsers as well.

Okay, an update on this problem. I've since replaced the sketch and it now works. So the problem is in the sketch somewhere. I'm not sure what the problem is, or why it works on some brewers and not others, but something in the sketch kills certain browsers. The code above should work fine.

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;">在高度方面不会做太多事情，除非您为 html 和 body 指定 CSS 规则，将它们也设置为高度 100%。基本上，首先肯定要让事情正常工作，我建议不要在画布和容器中指定宽度和高度。让 div 找出它需要自动调整到的尺寸，并让画布从pde 文件中函数size(...,...)内部的调用中获取其大小。setup

于 2013-04-11T00:46:14.180 回答