网络浏览器
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" 来判断。
Scrolling
Scrolling can be altered by modifying document.body.scrollTop and document.body.scrollLeft. However, there are drawbacks related to working with these properties:
- Both properties return 0 when accessed
- 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 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.