Difference between revisions of "网络浏览器"

Revision as of 15:41, 28 March 2013

3DS网络浏览器是在2011年6月更新的功能(JPN/EUR/USA)

从网络浏览器的说明/帮助字段可知：完全遵循 LGPL，OSS源代码可以从任天堂网站获得. 下载地址：[1]

3DS网络浏览器 Netfront Browser NX v1.0 基于 WebKit 引擎。

3DS网络浏览器可以存储 64 个书签。

User-agent 示例：

Mozilla/5.0 (Nintendo 3DS; U; ; fr) Version/1.7412.EU for a EUR/fr Nintendo 3DS
Mozilla/5.0 (Nintendo 3DS; U; ; en) Version/1.7455.US for a USA/en Nintendo 3DS
版本标号仅为示例...

Web标准

HTML 4.01
HTML 5 ( HTML5Test.com得分120/400)
XHTML 1.1
CSS 1
CSS 2.1
CSS 3 (一些功能不支持)
DOM Levels 1-3
ECMAScript (支持ECMA-262 第5版的一部分)
XMLHttpRequest Level 2
Canvas Element (一些功能不支持)

网络协议

HTTP 1.0
HTTP 1.1
SSLv3
TLS 1.0

图像格式

MPO
GIF
JPEG
PNG
BMP
ICO (不完全支持)

插件

不支持插件 (比如 Flash)

其他细节

Acid3 测试得分90/100。
网络图像可以存储到 SD Card，然后用 Nintendo 3DS Camera 查看。
存储到 SD Card 或者3DS本机内存的图像可以上传到博客或者其他使用以下HTML代码传图的网站。

<input type="file" />

HTML5Test.com说它支持拖拽缩放，但是实际上没做到。webkit已经有这样的代码，但是没有浏览器的接口。

Tips

User Agent

探测Nintendo 3DS浏览器的User Agent的代码：

<script type="text/javascript">
    if (navigator.userAgent.indexOf('Nintendo 3DS') == -1) { //如果UserAgent不是"Nintendo 3DS"
        location.replace('http://www.3dbrew.org'); //跳转到另一个页面
    }
</script>

你也可以用 navigator.platform=="Nintendo 3DS" 来判断。

滚动条

可以修改document.body.scrollTop and document.body.scrollLeft调整滚动条的位置。不过使用这些属性时候，相关细节需要注意：

访问时候两个属性都会返回0。
设置其中一个属性，会重置另一个属性的位置。

想要同时调整两者而不使他们的都重置为0，使用window.scrollTo这个方法。

事件

按键事件

以下按钮会触发onkeydown事件，onkeypress事件和 onkeyup事件:

值	按键
13	A
37	左
38	Up
39	右
40	下

这些事件不能取消他们的默认动作。其他按钮不能触发按键事件。

触摸/鼠标事件

onmousedown, onmouseup & onclick 都是浏览器触发的事件。但是onmousedown事件只有你抬起手写笔，或者长按两秒以上才会发生。屏幕上的文本选择模式被激活时，这和onmouseup事件的效果相同。这些事件也不能取消默认动作。

onmousemove 和触摸、手势事件不被支持。

屏幕分辨率

屏幕分辨率为400×240，浏览器中的可视面积400×220，触摸屏分辨率320×240，浏览器中触摸屏可视分辨率320×212。

你可以在两个屏幕中查看一个页面。操作时，下屏是可以操作的，而上屏随之滚动。这样在CSS计算样式时，在220px而不是432px的范围内，元素从下往上定位。

使用双屏

通常最简单的正确布局是创建包含双屏的HTML元素，比如这样：

<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="width=400">
    <style>
      body { margin: 0px; }
      #topscreen { width: 400px; height: 220px; overflow: hidden; }
      #bottomscreen { width: 320px; height: 212px; overflow: hidden; margin: 0 auto; }
    </style>
  </head>
  <body>
    <div id="topscreen">上屏</div>
    <div id="bottomscreen">下屏</div>
  </body>
</html>

使用这种方法很容易通过JavaScript操作页面。为了让窗口获得正确的位置，可以使用下面的JavaScript代码：

window.setInterval(function () {
    window.scrollTo(40, 220);  
}, 50);

这样如果用户不小心滚动了页面，页面能够自动复位。

Example Sites

Weapons and Colors (Short URL for 3DS : http://bit.ly/3DSwc)
jFox (Short URL for 3DS : http://bit.ly/iB7FqW)
Ditto3D
Nintendo 3DS Bookmarks - This is the first bookmark pre-installed in the browser.

@@ Line 68: / Line 68: @@
 * 你也可以用 <em>navigator.platform=="Nintendo 3DS"</em> 来判断。
-=== Scrolling ===
+=== 滚动条 ===
-Scrolling can be altered by modifying <em>document.body.scrollTop</em> and <em>document.body.scrollLeft</em>.  However, there are drawbacks related to working with these properties:
+可以修改<em>document.body.scrollTop</em> and <em>document.body.scrollLeft</em>调整滚动条的位置。不过使用这些属性时候，相关细节需要注意：
-* Both properties return 0 when accessed
+* 访问时候两个属性都会返回0。
-* Setting one property resets the other property's scroll position
+* 设置其中一个属性，会重置另一个属性的位置。
-In order to set both at the same time (without either resetting to 0), use <em>window.scrollTo</em>.
+想要同时调整两者而不使他们的都重置为0，使用<em>window.scrollTo</em>这个方法。
 === 事件 ===