26
edits
Changes
Meta viewport info + minor tweaks
==== Notes ====
==== Notes ====
* Viewport information can be specified with the <meta> element.
* The html "color" <input> type is not supported.
* The html "color" <input> type is not supported.
* 3D images appear as their right-eye image within webpages.
* 3D images appear as their right-eye image within webpages.
* Webpages are locked to the bottom screen when zooming is disabled, the webpage's initial scale is 100%, and the entire webpage can fit within the bottom screen's dimensions (320x212).
* Webpages are locked to the bottom screen when zooming is disabled, the webpage's initial scale is 1, and the entire webpage can fit within the bottom screen's dimensions (320x212).
* Interactable elements that are positioned partially outside of the bottom screen can temporarily be moved further inside the bottom screen by tapping them with the touchscreen.
* Interactable elements that are positioned partially outside of the bottom screen can temporarily be moved further inside the bottom screen by tapping them with the touchscreen.
* Favicons can be changed using Javascript, but they become unchangeable once the document's <em>readystatechange</em> event finishes firing with a ready state of "complete".
* Favicons can be changed using Javascript, but they become unchangeable once the document's <em>readystatechange</em> event finishes firing with a ready state of "complete".
The touch screen resolution is 320×240. However, the viewable area in the browser is <b>320×212</b> <em>or</em> <b>320×240</b>, depending on if the bottom browser bar is visible. The New3DS browser's bottom bar can hidden by scrolling and/or attempting to zoom in/out with the C-stick, unless scrolling and zooming have both been disabled.
The touch screen resolution is 320×240. However, the viewable area in the browser is <b>320×212</b> <em>or</em> <b>320×240</b>, depending on if the bottom browser bar is visible. The New3DS browser's bottom bar can hidden by scrolling and/or attempting to zoom in/out with the C-stick, unless scrolling and zooming have both been disabled.
You can have a page span both screens. However, the browser will behave as if the bottom screen is the only active screen and the top screen is scrolled off. This is important when computing CSS coordinates. Items positioned from the "bottom" will be positioned based on the height of the bottom screen, not the cumulative heights of both screens.
You can have a page span both screens. However, the browser will behave as if the bottom screen is the only active screen and the top screen is scrolled off. This is important when computing CSS coordinates. Items positioned from the "bottom" will be positioned based on the height of the bottom screen, not the cumulative height of both screens.
== Using Both Screens ==
== Using Both Screens ==
}, 0);
}, 0);
This automatically resets the position if the user accidentally scrolls the page. Zooming should probably also be disabled by adding <code>user-scalable=no</code> to the <meta> viewport element.
This automatically resets the position if the user accidentally scrolls the page. Zooming should probably also be disabled by adding <code>user-scalable=no</code> to the <meta> viewport element, though this will only have an effect in the New3DS browser.
==Example Sites==
==Example Sites==