26
edits
Changes
→Using Both Screens: Examples should now work on both Old3DS and New3DS
<html>
<html>
<head>
<head>
<meta name="viewport" content="width=400, initial-scale=1">
<meta name="viewport" content="width=320, initial-scale=1">
<style>
<style>
body { margin: 0px; }
body { margin: 0px; }
#topscreen { width: 400px; height: 215px; }
#topscreen { width: 400px; height: 215px; overflow: hidden; background-color: red; }
#bottomscreen { width: 320px; height: 212px; margin: 0 40px 28px; }
#bottomscreen { width: 320px; height: 212px; overflow: hidden; background-color: blue; margin: 0 40px 28px; }
</style>
</style>
</head>
</head>
This scheme allows the page to be easily manipulated through JavaScript. In order to have the window snap to the correct position, use the following JavaScript code:
This scheme allows the page to be easily manipulated through JavaScript. In order to have the window snap to the correct position, use the following JavaScript code:
window.setInterval(function() {
window.scrollTo(40, 215);
window.scrollTo(40, 215);
});
}, 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.