How to make websites 3DS formatted/fitted: Difference between revisions
mNo edit summary |
mNo edit summary |
||
| Line 1: | Line 1: | ||
Hello. I am Joshi, the creator of [http://joshi3ds.do.am Joshi 3DS], and I am here to teach you how to make your website 3DS compatible (although it may turn out to be sized as if it's DSi compatible). Here's a website "full" HTML code example: | Hello. I am Joshi, the creator of [http://joshi3ds.do.am Joshi 3DS], and I am here to teach you how to make your website 3DS compatible (although it may turn out to be sized as if it's DSi compatible). Here's a website "full" HTML code example: | ||
<html> | <html><br /> | ||
<meta name="viewport" content="width=400"> | <meta name="viewport" content="width=400"><br /> | ||
<title>YOUR TITLE</title> | <title>YOUR TITLE</title><br /> | ||
<head> | <head><br /> | ||
<style> | <style><br /> | ||
body{margin:0;} | body{margin:0;}<br /> | ||
#topscreen{width:400;height:220;overflow:hidden;} | #topscreen{width:400;height:220;overflow:hidden;}<br /> | ||
#bottomscreen{width:320;height:212;overflow:hidden;margin:0 auto;} | #bottomscreen{width:320;height:212;overflow:hidden;margin:0 auto;}<br /> | ||
</style> | </style><br /> | ||
</head> | </head><br /> | ||
<body> | <body><br /> | ||
<div id="topscreen">TOP SCREEN CONTENT</div> | <div id="topscreen">TOP SCREEN CONTENT</div><br /> | ||
<div id="bottomscreen">BOTTOM SCREEN CONTENT</div> | <div id="bottomscreen">BOTTOM SCREEN CONTENT</div><br /> | ||
<script> | <script><br /> | ||
window.setInterval(function();{ | window.setInterval(function();{<br /> | ||
window.scrollTo(40,220); | window.scrollTo(40,220);<br /> | ||
}, 50); | }, 50);<br /> | ||
</script> | </script><br /> | ||
</body> | </body><br /> | ||
</html> | </html> | ||
Note: "margin:0 auto;" means that the content in the area of the section that "margin:0 auto;" is in, will be automatically centered. BTW the script at the bottom auto-scrolls the page, even if you scroll elsewhere. | Note: "margin:0 auto;" means that the content in the area of the section that "margin:0 auto;" is in, will be automatically centered. BTW the script at the bottom auto-scrolls the page, even if you scroll elsewhere. | ||
Revision as of 07:50, 20 November 2012
Hello. I am Joshi, the creator of Joshi 3DS, and I am here to teach you how to make your website 3DS compatible (although it may turn out to be sized as if it's DSi compatible). Here's a website "full" HTML code example:
<html>
<meta name="viewport" content="width=400">
<title>YOUR TITLE</title>
<head>
<style>
body{margin:0;}
- topscreen{width:400;height:220;overflow:hidden;}
- bottomscreen{width:320;height:212;overflow:hidden;margin:0 auto;}
</style>
</head>
<body>
<div id="topscreen">TOP SCREEN CONTENT
<div id="bottomscreen">BOTTOM SCREEN CONTENT
<script>
window.setInterval(function();{
window.scrollTo(40,220);
}, 50);
</script>
</body>
</html>
Note: "margin:0 auto;" means that the content in the area of the section that "margin:0 auto;" is in, will be automatically centered. BTW the script at the bottom auto-scrolls the page, even if you scroll elsewhere.