Difference between revisions of "How to make websites 3DS formatted/fitted"

From 3dbrew
Jump to navigation Jump to search
m
m
Line 5: Line 5:
 
   <head>
 
   <head>
 
   <style>
 
   <style>
   body{margin:0;}
+
   body{margin:0px;}
   &#35;topscreen{width:400;height:220;overflow:hidden;}
+
   &#35;topscreen{height:220px;}
   &#35;bottomscreen{width:320;height:212;overflow:hidden;margin:0 auto;}
+
   &#35;bottomscreen{height:212px;}
 
   </style>
 
   </style>
 
   </head>
 
   </head>
Line 14: Line 14:
 
   &lt;div id="bottomscreen">BOTTOM SCREEN CONTENT</div>
 
   &lt;div id="bottomscreen">BOTTOM SCREEN CONTENT</div>
 
   <script>
 
   <script>
   window.setInterval(function();{
+
   window.setInterval(function(){
 
   window.scrollTo(40,220);
 
   window.scrollTo(40,220);
 
   }, 50);
 
   }, 50);

Revision as of 15:38, 30 November 2012

Hello. I am ジョシ (Joshi, aka Joshi 3DS Forums admin gjdog), the creator of Joshi 3DS, and I am here to teach you how to make your website 3DS compatible. Here's a website "full" HTML code example:

<html>
<meta name="viewport" content="width=320">
 <title>YOUR TITLE</title>
 <head>
 <style>
 body{margin:0px;}
 #topscreen{height:220px;}
 #bottomscreen{height:212px;}
 </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.


ウッド ジョシュア (Facebook) | ジョシ™ (Twitter)